/* OD-LAYOUT-PRIMITIVES v1 — structure only: display, flex/grid, overflow, wrapping, ratio. */
@layer od-layout {
:where(.od-stack,.od-row,.od-row-top,.od-cluster,.od-grid,.od-field,.od-stat,.od-cell,.od-tile)>:where(*){min-width:0}
.od-stack{display:flex;flex-direction:column;gap:var(--od-gap,8px)}.od-row{display:flex;align-items:center;gap:var(--od-gap,8px)}.od-row-top{display:flex;align-items:flex-start;gap:var(--od-gap,8px)}.od-cluster{display:flex;flex-wrap:wrap;align-items:center;gap:var(--od-gap,8px)}.od-fill{flex:1 1 0;min-width:0}.od-fixed{flex:none}.od-grid{display:grid;gap:var(--od-gap,12px);grid-template-columns:repeat(var(--od-cols,3),minmax(0,1fr))}
.od-stat,.od-field,.od-cell{display:grid;gap:var(--od-gap,2px)}:where(.od-stat,.od-field,.od-cell)>:where(*){display:block}.od-tile{display:grid;grid-template-rows:auto 1fr}:where(.od-tile)>:where(*){display:block}.od-media{display:block;width:100%;height:auto;aspect-ratio:var(--od-ratio,auto)}.od-media-cover{object-fit:cover}.od-truncate{display:block;max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.od-clamp-2,.od-clamp-3{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.od-clamp-2{-webkit-line-clamp:2}.od-clamp-3{-webkit-line-clamp:3}.od-lines-2{min-height:calc(2 * 1.4em)}.od-nowrap{white-space:nowrap}.od-keep{word-break:keep-all;overflow-wrap:anywhere}.od-screen{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%}.od-scroll{overflow-y:auto;overscroll-behavior:contain;min-height:0}.od-rail{display:flex;gap:var(--od-gap,8px);overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;padding-inline:var(--od-rail-pad,16px);scroll-padding-inline:var(--od-rail-pad,16px)}.od-rail::-webkit-scrollbar{display:none}:where(.od-rail)>:where(*){flex:none;scroll-snap-align:start}:where(.od-rail)>:where(:last-child){margin-inline-end:var(--od-rail-pad,16px)}.od-spacer{flex:none;visibility:hidden;pointer-events:none}.od-touch{min-width:44px;min-height:44px}
}
/* /OD-LAYOUT-PRIMITIVES v1 */
/* Creative — supplied token bindings. */
:root{--bg:#fff8d7;--surface:#ffffff;--surface-warm:#ffef9f;--fg:#1d1836;--fg-2:#4c426c;--muted:#796f91;--meta:#ff6b00;--border:#eadfba;--border-soft:#f5eccd;--accent:#ff6b00;--accent-on:#ffffff;--accent-hover:color-mix(in oklab,var(--accent),black 8%);--accent-active:color-mix(in oklab,var(--accent),black 14%);--success:#2e9d57;--warn:#ffb020;--danger:#e5484d;--font-display:Inter,system-ui,sans-serif;--font-body:Inter,system-ui,sans-serif;--font-mono:"SF Mono",ui-monospace,Menlo,monospace;--text-xs:12px;--text-sm:14px;--text-base:16px;--text-lg:18px;--text-xl:24px;--text-2xl:36px;--text-3xl:54px;--text-4xl:76px;--leading-body:1.52;--leading-tight:1.06;--tracking-display:-.025em;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-12:48px;--section-y-desktop:96px;--section-y-tablet:68px;--section-y-phone:48px;--radius-sm:10px;--radius-md:16px;--radius-lg:24px;--radius-pill:9999px;--elev-flat:none;--elev-ring:0 0 0 1px var(--border);--elev-raised:0 18px 44px rgba(29,24,54,.14);--focus-ring:0 0 0 4px rgba(255,107,0,.26);--motion-fast:150ms;--motion-base:240ms;--ease-standard:cubic-bezier(.2,0,0,1);--container-max:1180px;--container-gutter-desktop:36px;--container-gutter-tablet:24px;--container-gutter-phone:16px;
/* Functional extensions: accessible states and representative screen swatches. */
--line:color-mix(in srgb,var(--fg) 14%,var(--surface));--soft:color-mix(in srgb,var(--fg) 3%,var(--surface));--ink-orange:color-mix(in srgb,var(--accent) 62%,var(--fg));--error-text:color-mix(in srgb,var(--danger) 60%,var(--fg));--ral7047:#c5c7c4;--ral5014:#637d96;--antik:#eee9dc;--selected-color:var(--ral5014);--graphic-shadow:12px 12px 0 color-mix(in srgb,var(--fg) 12%,transparent)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--surface);color:var(--fg);font-family:var(--font-body);font-size:var(--text-base);line-height:var(--leading-body);-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a,input{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:wait;opacity:.65}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--fg);outline-offset:4px;box-shadow:var(--focus-ring)}img{max-width:100%}svg{display:block;width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;flex:none}h1,h2,h3,p,figure{margin:0}h1,h2,h3{font-family:var(--font-display);letter-spacing:var(--tracking-display);line-height:var(--leading-tight)}h2{font-size:clamp(32px,3.4vw,48px);font-weight:750}h3{font-size:var(--text-xl)}[hidden]{display:none!important}.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--container-gutter-desktop)}.skip{position:fixed;top:8px;left:8px;z-index:100;background:var(--surface);padding:12px;transform:translateY(-150%)}.skip:focus{transform:translateY(0)}.icon-defs{position:absolute;width:0;height:0;overflow:hidden}.eyebrow{font-size:var(--text-xs);font-weight:750;letter-spacing:.12em;text-transform:uppercase}.muted{color:var(--fg-2)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;padding:12px 24px;border:1px solid transparent;border-radius:var(--radius-md);font-size:var(--text-base);font-weight:700;line-height:1.3;transition:transform var(--motion-fast) var(--ease-standard),background-color var(--motion-fast) var(--ease-standard);white-space:nowrap}.btn-primary{background:var(--accent);color:var(--fg)}.btn-dark{background:var(--fg);color:var(--surface)}.btn-secondary{background:var(--surface);border-color:var(--line);color:var(--fg)}.text-link{display:inline-flex;align-items:center;gap:12px;min-height:44px;font-size:var(--text-sm);font-weight:700;text-decoration:underline;text-underline-offset:5px}.icon-btn{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid var(--line);border-radius:50%;background:var(--surface);color:var(--fg)}.section{padding-block:80px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:32px}.section-head .eyebrow{margin-bottom:12px}.section-head p:not(.eyebrow){max-width:480px;margin-top:16px;color:var(--fg-2)}
/* Store navigation */
.announcement{background:var(--fg);color:var(--surface);font-size:var(--text-xs)}.announcement .container{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:36px}.announcement p{display:flex;align-items:center;gap:8px}.announcement svg{width:16px;height:16px}.announcement a{text-decoration:underline;text-underline-offset:3px}.masthead{display:flex;align-items:center;justify-content:space-between;gap:32px;padding-block:24px}.brand{display:block;flex:none;width:228px}.brand img{display:block;width:100%;height:auto}.search{flex:1;max-width:440px}.search label{display:block;font-size:var(--text-xs);color:var(--fg-2);margin:0 0 4px 16px}.search-box{display:flex;align-items:center;border:1px solid var(--line);background:var(--soft);border-radius:var(--radius-pill);padding:0 8px 0 16px}.search input{display:block;min-width:0;width:100%;height:44px;border:0;background:transparent;color:var(--fg);outline-offset:0}.search input::placeholder{color:var(--fg-2)}.search button{background:transparent;border:0;min-width:44px;min-height:44px;display:grid;place-items:center;color:var(--fg)}.header-actions{display:flex;align-items:center;gap:16px}.cart-trigger{display:flex;align-items:center;gap:8px;background:none;border:0;padding:8px 0;min-height:44px;color:var(--fg);font-size:var(--text-sm);font-weight:650}.count{display:grid;place-items:center;min-width:24px;height:24px;border-radius:50%;background:var(--surface-warm);font-size:var(--text-xs)}.menu-trigger{display:none}.nav-wrap{border-block:1px solid var(--line)}.nav{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:56px}.nav-links{display:flex;align-items:center;gap:28px;flex-wrap:wrap}.nav a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:var(--text-sm);font-weight:650}.nav a svg{width:16px;height:16px}.nav .nav-inspiration{color:var(--ink-orange)}
/* Opening composition: normal-flow regions, decorative badge only. */
.hero-wrap{padding-top:24px}.hero{background:var(--bg);border-radius:var(--radius-lg);padding:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center}.hero-copy .eyebrow{display:flex;align-items:center;gap:8px;margin-bottom:24px}.eyebrow-dot{display:block;width:8px;height:8px;border-radius:50%;background:var(--accent)}h1{font-size:clamp(52px,5.8vw,76px);font-weight:800;letter-spacing:-.055em;max-width:560px}.hero-copy h1 em{font-style:normal;color:var(--ink-orange)}.hero-description{max-width:390px;font-size:var(--text-lg);color:var(--fg-2);margin-top:24px}.hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-top:32px}.hero-note{display:flex;align-items:center;gap:8px;font-size:var(--text-xs);color:var(--fg-2);margin-top:24px}.hero-note svg{width:16px;height:16px}.hero-art{display:grid;gap:16px;position:relative;min-width:0}.hero-photo{position:relative}.hero-photo img{border-radius:var(--radius-md);box-shadow:var(--elev-raised)}.photo-badge{position:absolute;top:16px;right:16px;display:grid;gap:4px;place-content:center;width:88px;height:88px;background:var(--surface-warm);color:var(--fg);border-radius:50%;text-align:center;box-shadow:var(--graphic-shadow);font-size:var(--text-xs);line-height:1.3}.photo-badge svg{width:24px;height:24px;margin:auto}.art-bottom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px}.art-caption{background:var(--surface);padding:20px;border-radius:var(--radius-md);display:flex;flex-direction:column;justify-content:space-between;gap:16px;box-shadow:0 4px 0 var(--border)}.art-caption .eyebrow{font-size:10px}.art-caption strong{font-size:var(--text-lg);line-height:1.3;font-weight:700}.mini-palette{background:var(--surface-warm);border-radius:var(--radius-md);padding:20px;display:flex;flex-direction:column;justify-content:space-between;gap:16px}.mini-palette p{font-size:var(--text-sm);font-weight:650}.paint-dots{display:flex;gap:8px}.paint-dot{display:block;width:32px;height:32px;border:3px solid var(--surface);border-radius:50%;background:var(--ral5014);box-shadow:0 2px 4px color-mix(in srgb,var(--fg) 16%,transparent)}.paint-dot:nth-child(2){background:var(--ral7047)}.paint-dot:nth-child(3){background:var(--accent)}.paint-dot:nth-child(4){background:var(--fg)}.benefits{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));padding-block:28px;border-bottom:1px solid var(--line);gap:24px}.benefit{display:flex;justify-content:center;align-items:center;gap:12px}.benefit svg{width:28px;height:28px}.benefit strong{font-size:var(--text-sm)}.benefit small{font-size:var(--text-xs);color:var(--fg-2)}
/* Surface selection */
.surface-section{padding-top:64px;padding-bottom:24px}.surface-head{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:24px}.surface-head h2{font-size:var(--text-2xl)}.surface-head p{font-size:var(--text-sm);color:var(--fg-2)}.surfaces{--od-cols:5;--od-gap:12px}.surface-btn{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:16px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-md);color:var(--fg);min-height:80px;transition:background-color var(--motion-fast),transform var(--motion-fast)}.surface-btn .od-field{gap:8px;text-align:left}.surface-btn .od-field svg{width:28px;height:28px}.surface-btn span{display:block;font-size:var(--text-sm);font-weight:700}.surface-btn>.arrow{width:16px;height:16px}.surface-btn[aria-pressed=true]{background:var(--fg);color:var(--surface);border-color:var(--fg)}
/* Products */
.products-section{padding-top:48px}.products-head{align-items:center}.products-head h2{font-size:clamp(32px,3.4vw,44px)}.filter-summary{display:flex;align-items:center;gap:12px;flex-wrap:wrap;min-height:40px;margin-bottom:24px;font-size:var(--text-sm);color:var(--fg-2)}.filter-summary button{border:0;background:none;color:var(--fg);text-decoration:underline;text-underline-offset:4px;min-height:44px;padding:8px}.products{--od-cols:4;--od-gap:20px}.product{border:1px solid var(--line);border-radius:var(--radius-md);background:var(--surface);padding:12px;display:flex;flex-direction:column;min-width:0;transition:box-shadow var(--motion-base),transform var(--motion-base)}.product-media{display:block;position:relative;border-radius:var(--radius-sm);background:var(--soft)}.product-media img{border-radius:var(--radius-sm)}.product-tag{position:absolute;top:12px;left:12px;background:var(--surface);border-radius:var(--radius-pill);padding:4px 8px;font-size:10px;font-weight:750;letter-spacing:.05em;text-transform:uppercase}.product-body{padding:16px 4px 4px;display:flex;flex-direction:column;flex:1;gap:12px}.product-kicker{font-size:10px;letter-spacing:.08em;font-weight:650;color:var(--fg-2);text-transform:uppercase}.product h3{font-size:var(--text-base);line-height:1.45;letter-spacing:-.015em;font-weight:700}.product-options{font-size:var(--text-xs);color:var(--fg-2)}.product-price-row{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:8px}.price{display:block;font-size:var(--text-lg);font-weight:750;white-space:nowrap}.price small{font-weight:400;font-size:var(--text-xs)}.add-btn{background:var(--surface-warm);border-color:transparent}.product-footnote{margin-top:20px;font-size:var(--text-xs);color:var(--fg-2);max-width:720px}.empty-products{padding:48px 24px;text-align:center;border:1px dashed var(--line);border-radius:var(--radius-md)}.empty-products p{margin:12px auto 24px;max-width:440px;color:var(--fg-2)}
/* Color story */
.color-section{padding:0 0 80px}.color-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px;border-radius:var(--radius-lg);background:var(--fg);color:var(--surface);padding:48px}.color-copy .eyebrow{color:var(--surface-warm);margin-bottom:24px}.color-copy h2{font-size:clamp(36px,4vw,54px);max-width:420px}.color-copy>p:not(.eyebrow){color:color-mix(in srgb,var(--surface) 80%,var(--fg));margin-top:20px;max-width:400px}.color-copy .text-link{margin-top:24px}.color-preview{display:grid;gap:20px}.color-specimens{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.swatch{display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:12px;min-height:220px;padding:16px 12px;border:3px solid transparent;border-radius:var(--radius-sm);background:var(--ral5014);color:var(--surface);text-align:left;box-shadow:0 12px 16px color-mix(in srgb,var(--fg) 40%,transparent);transition:transform var(--motion-fast)}.swatch.gray{background:var(--ral7047);color:var(--fg)}.swatch.white{background:var(--antik);color:var(--fg)}.swatch[aria-pressed=true]{border-color:var(--surface-warm);transform:translateY(-8px)}.swatch .check{display:flex;align-items:center;justify-content:center;width:24px;height:24px;border:1px solid currentColor;border-radius:50%;margin-bottom:auto}.swatch .check svg{width:16px;height:16px;visibility:hidden}.swatch[aria-pressed=true] .check svg{visibility:visible}.swatch .od-field{gap:4px}.swatch strong{font-size:var(--text-sm);line-height:1.3}.swatch small{font-size:10px;line-height:1.4}.selected-label{font-size:var(--text-sm);display:flex;gap:8px;flex-wrap:wrap;justify-content:space-between}.selected-label span{display:block}.color-disclaimer{font-size:var(--text-xs);color:color-mix(in srgb,var(--surface) 75%,var(--fg))}
/* Journal and closing */
.guides{padding-top:0}.guide-grid{--od-cols:3;--od-gap:24px}.guide-card{color:var(--fg);text-decoration:none;display:grid;gap:16px;align-content:start}.guide-card .od-media{border-radius:var(--radius-md)}.guide-card .eyebrow{font-size:10px;color:var(--fg-2)}.guide-card h3{font-size:var(--text-lg);line-height:1.4;letter-spacing:-.02em;max-width:340px}.guide-link{display:flex;align-items:center;gap:8px;font-size:var(--text-sm);font-weight:700;min-height:44px}.guide-link svg{width:16px;height:16px}.help-strip{padding:32px;background:var(--surface-warm);border-radius:var(--radius-lg);display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:64px}.help-strip h2{font-size:var(--text-xl)}.help-strip p{font-size:var(--text-sm);margin-top:8px;max-width:560px}.footer{border-top:1px solid var(--line);padding:48px 0 24px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px}.footer .brand{width:216px;margin-bottom:20px}.footer p{font-size:var(--text-sm);color:var(--fg-2);max-width:320px}.footer h3{font-size:var(--text-sm);letter-spacing:0;margin-bottom:12px}.footer-links{display:grid;gap:0}.footer-links a{display:flex;align-items:center;min-height:40px;font-size:var(--text-sm);color:var(--fg-2)}.footer-bottom{border-top:1px solid var(--line);margin-top:32px;padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:16px;font-size:var(--text-xs);color:var(--fg-2)}
/* Drawer and feedback */
dialog{color:var(--fg);background:var(--surface);border:0}dialog::backdrop{background:color-mix(in srgb,var(--fg) 40%,transparent)}.cart-dialog{position:fixed;inset:0 0 0 auto;width:min(480px,100%);max-width:100%;height:100%;max-height:100dvh;margin:0;padding:0;border-radius:24px 0 0 24px}.cart-shell{height:100%;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr) auto}.cart-header{padding:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid var(--line)}.cart-header h2{font-size:var(--text-xl)}.cart-content{padding:24px;overflow-y:auto;overscroll-behavior:contain}.cart-empty{display:grid;justify-items:center;gap:16px;padding-top:48px;text-align:center}.cart-empty>svg{width:48px;height:48px}.cart-empty p{color:var(--fg-2);max-width:300px}.cart-item{display:grid;grid-template-columns:72px minmax(0,1fr);gap:16px;padding-bottom:24px;margin-bottom:24px;border-bottom:1px solid var(--line)}.cart-item img{border-radius:var(--radius-sm)}.cart-item h3{font-size:var(--text-sm);line-height:1.5;letter-spacing:0}.cart-item .price{font-size:var(--text-base);margin-top:8px}.quantity{display:flex;align-items:center;gap:8px;margin-top:12px;flex-wrap:wrap}.quantity button{display:grid;place-items:center;min-width:44px;min-height:44px;border:1px solid var(--line);background:var(--surface);border-radius:var(--radius-sm);color:var(--fg)}.quantity button svg{width:16px;height:16px}.quantity .remove{margin-left:auto;border:0;font-size:var(--text-xs);text-decoration:underline}.quantity output{min-width:24px;text-align:center}.cart-footer{padding:24px;border-top:1px solid var(--line);background:var(--bg)}.cart-total{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.cart-footer p{font-size:var(--text-xs);color:var(--fg-2);margin-bottom:16px}.cart-footer .btn{width:100%}.confirm-dialog{width:min(400px,calc(100% - 32px));padding:32px;border-radius:var(--radius-lg)}.confirm-dialog h2{font-size:var(--text-xl);margin-bottom:16px}.confirm-dialog p{color:var(--fg-2)}.confirm-dialog .actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);z-index:40;width:max-content;max-width:calc(100% - 32px);background:var(--fg);color:var(--surface);border:1px solid var(--surface);border-radius:var(--radius-md);padding:12px 16px;box-shadow:var(--elev-raised);display:flex;align-items:center;gap:16px;font-size:var(--text-sm)}.toast button{min-height:44px;background:transparent;border:0;color:var(--surface-warm);font-size:var(--text-sm);text-decoration:underline;text-underline-offset:4px;white-space:nowrap}.toast[hidden]{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(hover:hover){.btn-primary:hover{background:var(--accent-hover);transform:translateY(-2px)}.btn-dark:hover{background:var(--fg-2);transform:translateY(-2px)}.btn-secondary:hover,.icon-btn:hover{border-color:var(--fg);background:var(--bg)}.text-link:hover,.nav a:hover,.footer-links a:hover{color:var(--ink-orange)}.surface-btn:hover{background:var(--bg);transform:translateY(-2px)}.surface-btn[aria-pressed=true]:hover{background:var(--fg-2)}.product:hover{box-shadow:var(--elev-raised);transform:translateY(-4px)}.add-btn:hover{background:var(--accent)}.guide-card:hover .guide-link{text-decoration:underline;text-underline-offset:4px}.swatch:hover{transform:translateY(-8px)}.cart-trigger:hover{color:var(--ink-orange)}}
@media(min-width:1440px){.hero{gap:48px}.hero-copy h1{font-size:var(--text-4xl)}}
@media(max-width:1023px){.container{padding-inline:var(--container-gutter-tablet)}.masthead{gap:24px}.brand{width:200px}.nav-links{gap:20px}.nav{gap:16px}.hero{padding:32px;gap:24px}h1{font-size:60px}.hero-description{font-size:var(--text-base)}.hero-actions{gap:8px}.hero-actions .btn{padding:12px 16px}.hero-actions .text-link{font-size:var(--text-xs)}.art-caption,.mini-palette{padding:16px}.paint-dots{gap:4px}.paint-dot{width:28px;height:28px}.benefits{gap:16px}.surface-btn{padding:12px}.surface-btn>.arrow{display:none}.products{--od-gap:12px}.product{padding:8px}.product-body{padding:12px 4px 4px}.price{font-size:var(--text-base)}.color-panel{padding:32px;gap:32px}.swatch{min-height:200px;padding:12px 8px}.swatch strong{font-size:var(--text-xs)}.footer-grid{gap:32px}}
@media(max-width:767px){.container{padding-inline:var(--container-gutter-phone)}.announcement .container{justify-content:center;min-height:32px}.announcement p:last-child{display:none}.masthead{padding-block:16px;gap:12px;flex-wrap:wrap}.brand{width:190px}.header-actions{margin-left:auto;gap:12px}.cart-label{display:none}.menu-trigger{display:inline-flex}.search{order:3;flex-basis:100%;max-width:none}.search label{font-size:10px}.search-box{padding-left:16px}.nav-wrap{display:none}.nav-wrap.open{display:block}.nav,.nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0}.nav{padding-block:12px}.nav a{min-height:48px;justify-content:space-between;padding-inline:8px}.nav-inspiration{border-top:1px solid var(--line);margin-top:8px}.hero-wrap{padding-top:16px}.hero{padding:32px 24px;grid-template-columns:1fr;gap:32px}.hero-copy .eyebrow{margin-bottom:20px}h1{font-size:clamp(48px,9.2vw,68px);max-width:600px}.hero-description{max-width:430px;margin-top:20px}.hero-actions{gap:16px;margin-top:24px}.hero-actions .btn{padding-inline:20px}.hero-actions .text-link{font-size:var(--text-sm)}.hero-note{margin-top:20px}.hero-art{gap:12px}.art-bottom{gap:12px}.art-caption{min-height:120px}.photo-badge{width:72px;height:72px;top:12px;right:12px;font-size:10px}.benefits{padding-block:24px;gap:16px;grid-template-columns:1fr}.benefit{justify-content:flex-start;padding-inline:8px}.benefit .od-field{grid-template-columns:1fr;gap:0}.benefit svg{width:24px;height:24px}.benefit small{font-size:var(--text-xs)}.surface-section{padding-top:40px}.surface-head{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:20px}.surface-head h2{font-size:32px}.surfaces{--od-cols:2;--od-gap:12px}.surface-btn:first-child{grid-column:1/-1;min-height:60px}.surface-btn:first-child .od-field{display:flex;align-items:center;gap:12px}.surface-btn>.arrow{display:block}.surface-btn{padding:16px;min-height:96px}.section{padding-block:48px}.products-section{padding-top:32px}.section-head{align-items:flex-start;gap:16px;flex-direction:column;margin-bottom:24px}.section-head .text-link{min-height:36px}.products{--od-cols:2;--od-gap:12px}.product h3{font-size:var(--text-sm)}.product-options{font-size:10px}.product-price-row{align-items:flex-start;flex-direction:column;gap:12px}.product-price-row .add-btn{border-radius:var(--radius-sm);width:100%;min-height:44px}.product-price-row .add-btn::before{content:'В корзину';font-size:var(--text-xs);font-weight:650;margin-right:8px}.product-price-row .add-btn svg{width:16px;height:16px}.product-tag{font-size:8px;top:8px;left:8px}.color-section{padding-bottom:48px}.color-panel{grid-template-columns:1fr;gap:40px;padding:32px 24px}.color-copy h2{font-size:40px}.color-specimens{gap:8px}.swatch{padding:12px 8px;min-height:200px}.color-copy .eyebrow{margin-bottom:16px}.guide-grid{--od-cols:1;--od-gap:32px}.guide-card h3{max-width:none;font-size:var(--text-xl)}.guides{padding-top:0}.help-strip{margin-bottom:48px;padding:24px;flex-direction:column;align-items:flex-start}.help-strip .btn{width:100%}.footer-grid{grid-template-columns:1fr 1fr;gap:32px 24px}.footer-about{grid-column:1/-1}.footer-bottom{align-items:flex-start;flex-direction:column}.cart-dialog{border-radius:0}.toast{bottom:16px;gap:12px;font-size:var(--text-xs)}.toast button{font-size:var(--text-xs)}}
@media(max-width:374px){.brand{width:168px}.header-actions{gap:8px}.hero{padding:24px 20px}h1{font-size:46px}.hero-actions{align-items:stretch;flex-direction:column}.hero-actions .text-link{justify-content:center}.art-caption,.mini-palette{padding:12px}.paint-dot{width:24px;height:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.swatch[aria-pressed=true]{transform:none}}
/* Russian localization: allow longer labels to reflow in normal flow. */
.hero-copy h1{font-size:clamp(44px,5vw,64px)}
.art-caption .eyebrow{letter-spacing:.06em}
.hero-actions .text-link{font-size:var(--text-sm)}
@media(min-width:1440px){.hero-copy h1{font-size:64px}}
@media(min-width:768px) and (max-width:1023px){.nav-links{gap:16px}.nav a{font-size:var(--text-xs)}.surface-btn span{font-size:var(--text-xs)}}
@media(max-width:767px){.hero-copy h1{font-size:clamp(40px,7.8vw,60px)}.announcement p{font-size:10px}.hero-actions{align-items:flex-start;flex-direction:column}.surface-btn span{font-size:var(--text-sm)}.color-copy h2{font-size:36px}.swatch small{overflow-wrap:anywhere}.cart-footer .btn{padding-inline:16px}.product-price-row .add-btn::before{font-size:var(--text-xs)}}
/* aquacooltrend.ru — shop pages. Existing Creative tokens remain the authority. */
:root{--page-gap:32px;--form-gap:20px;--page-title:clamp(32px,4vw,52px)}
html{scroll-behavior:auto}main{min-height:52vh}.brand{width:264px}.footer .brand{width:264px}.announcement p{font-size:var(--text-xs)}.nav a[aria-current=page]{text-decoration:underline;text-underline-offset:6px}.nav .nav-links{gap:24px}.page{padding-block:40px 64px}.page h1{font-size:var(--page-title);max-width:880px;letter-spacing:-.04em;overflow-wrap:anywhere}.page-intro{max-width:720px;color:var(--fg-2);margin-top:20px}.breadcrumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:24px;font-size:var(--text-sm);color:var(--fg-2)}.breadcrumbs a{min-height:44px;display:inline-flex;align-items:center;text-decoration:underline;text-underline-offset:4px}.breadcrumbs span{display:block}.demo-note{border:1px solid var(--border);background:var(--bg);padding:16px 20px;border-radius:var(--radius-sm);font-size:var(--text-sm);color:var(--fg-2);margin-block:24px}.demo-note strong{color:var(--fg)}.page-toolbar{display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.55fr);gap:24px;align-items:end;margin-block:32px}.category-buttons{display:flex;flex-wrap:wrap;gap:8px}.category-buttons button{display:flex;align-items:center;min-height:44px;padding:8px 20px;border:1px solid var(--line);border-radius:var(--radius-pill);color:var(--fg);background:var(--surface);font-weight:650}.category-buttons button[aria-pressed=true]{color:var(--surface);background:var(--fg);border-color:var(--fg)}.sort-field{display:grid;gap:8px}.sort-field label{font-size:var(--text-sm);color:var(--fg-2)}select{display:block;width:100%;min-height:48px;padding:8px 12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-sm);color:var(--fg);font:inherit;cursor:pointer}select:focus-visible,textarea:focus-visible{outline:3px solid var(--fg);outline-offset:4px}.results-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:24px}.quiet-btn{background:none;border:0;color:var(--fg);min-height:44px;padding:8px;text-decoration:underline;text-underline-offset:4px;font:inherit;font-size:var(--text-sm)}.product-kicker,.product-options{font-size:var(--text-sm)}.product-tag{font-size:var(--text-xs)}.product-body{gap:12px}.product h3{font-size:var(--text-lg);line-height:1.45}.product .price{font-size:var(--text-lg)}.product-price-row .add-btn::before{content:none}.product-body .details-link{font-size:var(--text-sm);text-decoration:underline;text-underline-offset:4px;display:flex;align-items:center;min-height:44px}.product-price-row{align-items:center;flex-direction:row}.product-price-row .add-btn{width:44px;border-radius:50%}.sample-caption{font-size:var(--text-xs);color:var(--fg-2)}.detail-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px;margin-top:32px;align-items:start}.detail-photo{padding:24px;border-radius:var(--radius-lg);background:var(--soft)}.detail-photo img{border-radius:var(--radius-md);width:100%;height:auto}.detail-photo figcaption{margin-top:16px;font-size:var(--text-sm);color:var(--fg-2)}.detail-info{display:grid;gap:24px;min-width:0}.detail-info h1{font-size:clamp(32px,3.5vw,44px)}.detail-price{display:grid;gap:4px}.detail-price strong{font-size:var(--text-2xl);white-space:nowrap;line-height:1.3}.detail-price small{font-size:var(--text-sm);color:var(--fg-2)}.purchase-row{display:flex;align-items:end;gap:16px;flex-wrap:wrap}.purchase-row .btn{flex:1}.qty-field{display:grid;gap:8px}.qty-field label{font-size:var(--text-sm);font-weight:650}.qty-control{display:flex;align-items:center;gap:8px}.qty-control button{display:grid;place-items:center;width:44px;min-height:48px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--fg)}.qty-control input{display:block;width:64px;min-height:48px;padding:8px;border:1px solid var(--line);border-radius:var(--radius-sm);text-align:center;font:inherit;background:var(--surface);color:var(--fg)}.detail-copy{margin-top:48px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}.detail-copy h2{font-size:var(--text-xl);margin-bottom:20px}.detail-copy p{max-width:65ch}.specs{margin:0;display:grid}.specs>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;padding-block:12px;border-bottom:1px solid var(--line)}.specs dt{color:var(--fg-2)}.specs dd{margin:0;overflow-wrap:anywhere}.related{margin-top:64px}.related h2{font-size:var(--text-2xl);margin-bottom:24px}.purchase-error{color:var(--error-text);font-size:var(--text-sm)}.two-column{display:grid;grid-template-columns:minmax(0,1fr) minmax(280px,.55fr);gap:32px;align-items:start;margin-top:32px}.basket-list{display:grid;gap:0}.basket-item{display:grid;grid-template-columns:104px minmax(0,1fr);gap:24px;padding-block:24px;border-bottom:1px solid var(--line)}.basket-item:first-child{padding-top:0}.basket-item img{border-radius:var(--radius-sm)}.basket-body{display:grid;gap:12px}.basket-body h2{font-size:var(--text-lg);line-height:1.4}.basket-body p{font-size:var(--text-sm);color:var(--fg-2)}.basket-price{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.basket-price .price{font-size:var(--text-xl)}.summary-panel{padding:24px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg);display:grid;gap:20px}.summary-panel h2{font-size:var(--text-xl)}.summary-line{display:flex;justify-content:space-between;align-items:baseline;gap:16px}.summary-line>*{display:block;min-width:0}.summary-line strong{white-space:nowrap}.summary-panel .btn{width:100%;padding-inline:16px}.summary-panel p{font-size:var(--text-sm);color:var(--fg-2)}.summary-divider{border:0;border-top:1px solid var(--border);width:100%;margin:0}.summary-items{display:grid;gap:16px}.summary-product{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;font-size:var(--text-sm)}.summary-product>span{display:block;overflow-wrap:anywhere}.summary-product strong{white-space:nowrap}.empty-state{display:grid;justify-items:start;gap:20px;padding:40px;background:var(--bg);border-radius:var(--radius-lg);margin-block:32px}.empty-state h2{font-size:var(--text-2xl)}.empty-state p{max-width:600px;color:var(--fg-2)}.step-list{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:16px;margin:24px 0 0;font-size:var(--text-sm);color:var(--fg-2)}.step-list li{display:flex;align-items:center;gap:8px}.step-list .step-number{display:grid;place-items:center;width:28px;height:28px;border:1px solid var(--line);border-radius:50%;font-weight:700}.step-list [aria-current=step]{font-weight:750;color:var(--fg)}.step-list [aria-current=step] .step-number{background:var(--surface-warm);border-color:var(--surface-warm)}.checkout-form{display:grid;gap:32px}.checkout-form fieldset{padding:0;border:0;margin:0;min-width:0}.checkout-form legend{font-size:var(--text-xl);font-weight:750;margin-bottom:24px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--form-gap)}.form-field{display:grid;align-content:start;gap:8px;min-width:0}.form-field.full{grid-column:1/-1}.form-field label{font-weight:650}.form-field input,.form-field textarea{display:block;width:100%;min-height:52px;padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--fg);font:inherit}.form-field textarea{resize:vertical;min-height:100px}.form-field [aria-invalid=true]{border-color:var(--error-text)}.field-error{color:var(--error-text);font-size:var(--text-sm)}.field-help{font-size:var(--text-sm);color:var(--fg-2)}.error-summary{padding:20px;border:1px solid var(--error-text);border-radius:var(--radius-sm);color:var(--error-text);background:var(--surface)}.error-summary strong{display:block;margin-bottom:8px}.error-summary ul{margin:0;padding-left:24px}.error-summary a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline}.delivery-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:24px}.radio-option{display:flex;align-items:flex-start;gap:12px;padding:16px;border:1px solid var(--line);border-radius:var(--radius-md);cursor:pointer}.radio-option:has(input:checked){border-color:var(--fg);background:var(--bg)}.radio-option input{accent-color:var(--fg);width:20px;height:20px;flex:none;margin:4px 0}.radio-option strong,.radio-option small{display:block}.radio-option small{font-size:var(--text-sm);color:var(--fg-2);margin-top:4px}.form-note{font-size:var(--text-sm);color:var(--fg-2)}.checkout-submit{display:grid;gap:16px}.checkout-submit button{justify-self:start;max-width:100%}.order-progress{font-size:var(--text-sm);color:var(--fg-2)}.success-block{display:grid;justify-items:start;gap:24px;max-width:760px;padding:40px;border-radius:var(--radius-lg);background:var(--bg);margin-top:32px}.success-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--surface-warm)}.success-icon svg{width:32px;height:32px}.success-block .actions{display:flex;gap:16px;flex-wrap:wrap}.success-block h1{font-size:clamp(32px,4vw,48px)}.success-block p{max-width:62ch}.success-block dl{width:100%}.footer-bottom .text-link{font-size:var(--text-xs)}.color-preview .swatch{min-height:200px}.footer p{max-width:480px}.footer .brand img{width:100%;height:auto}.hero-actions{align-items:center}.home-intro{padding-top:24px}.catalog-shortcuts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-top:48px}.shortcut{display:flex;justify-content:space-between;align-items:center;padding:24px;border:1px solid var(--line);border-radius:var(--radius-md);font-weight:700;gap:16px}.shortcut>span{display:block}.shortcut svg{flex:none}.wide-copy{max-width:65ch}.storage-notice{font-size:var(--text-sm);color:var(--error-text);padding:12px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);margin-top:16px}.focus-heading:focus{outline:none}.product-media .product-tag{position:static;display:block;border-radius:0;background:var(--bg);padding:8px 12px}.product-media img{border-radius:var(--radius-sm) var(--radius-sm) 0 0}
@media(hover:hover){.category-buttons button:hover{border-color:var(--fg)}.shortcut:hover{background:var(--bg)}.quiet-btn:hover{color:var(--ink-orange)}.basket-body h2 a:hover,.breadcrumbs a:hover{color:var(--ink-orange)}}
@media(min-width:1440px){.detail-layout{gap:64px}}
@media(max-width:1023px){.brand{width:232px}.masthead{gap:20px}.nav .nav-links{gap:20px}.two-column{grid-template-columns:minmax(0,1fr) minmax(260px,.65fr);gap:24px}.detail-layout{gap:32px}.detail-copy{gap:32px}.summary-panel{padding:20px}.product h3{font-size:var(--text-base)}.product-price-row{align-items:start;flex-direction:column}.product-price-row .add-btn{width:100%;border-radius:var(--radius-sm)}.product-price-row .add-btn::before{content:'В корзину';font-size:var(--text-sm);font-weight:650;margin-right:8px}}
@media(max-width:767px){.brand{width:224px}.masthead{gap:8px}.header-actions{gap:8px}.nav .nav-links{gap:0}.announcement .container{justify-content:start}.announcement p{font-size:10px}.page{padding-block:24px 48px}.page-toolbar{grid-template-columns:1fr;gap:20px}.page-intro{margin-top:16px}.detail-layout,.detail-copy,.two-column{grid-template-columns:1fr;gap:32px}.detail-photo{padding:16px}.detail-info{gap:20px}.detail-info h1{font-size:32px}.detail-copy{margin-top:32px}.specs>div{gap:16px}.basket-item{grid-template-columns:80px minmax(0,1fr);gap:16px}.basket-price .price{font-size:var(--text-lg)}.basket-item .qty-control{gap:8px}.basket-item .qty-control input{width:48px}.basket-price{gap:8px}.form-grid,.delivery-options{grid-template-columns:1fr}.form-field.full{grid-column:auto}.checkout-submit .btn{width:100%;font-size:var(--text-sm);padding-inline:12px}.empty-state,.success-block{padding:24px}.success-block .actions{flex-direction:column;align-items:stretch;width:100%}.summary-panel{padding:24px}.catalog-shortcuts{grid-template-columns:1fr;gap:12px;padding-top:32px}.shortcut{padding:20px}.detail-info .purchase-row .btn{min-width:160px}.color-copy h2{font-size:32px}.products{--od-cols:2}.product-price-row .add-btn::before{font-size:var(--text-xs)}.product h3{font-size:var(--text-base)}.category-buttons button{padding-inline:16px}.demo-note{padding:16px}.hero-actions{align-items:start}.footer .brand{width:264px}.footer-grid{grid-template-columns:1fr 1fr}.toast{align-items:center}.toast button{font-size:var(--text-xs)}.selected-label{flex-direction:column}.swatch strong{font-size:var(--text-sm)}.swatch small{font-size:var(--text-xs)}.form-note{overflow-wrap:anywhere}}
@media(max-width:374px){.brand{width:196px}.products{--od-cols:1}.product-price-row{flex-direction:row;align-items:center}.product-price-row .add-btn{width:44px;border-radius:50%}.product-price-row .add-btn::before{content:none}.hero-copy h1{font-size:36px}.swatch strong{font-size:var(--text-xs)}}
/* Product content update — full-frame 900 × 1200 imagery, three categories. */
.products{--od-cols:3}.product-media img{aspect-ratio:3/4;object-fit:contain}.product .price{font-size:var(--text-base)}.product-price-row{gap:8px}.detail-photo{padding:0;background:var(--surface)}.detail-photo .od-media{aspect-ratio:3/4;border-radius:var(--radius-lg)}.detail-copy{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr)}.detail-copy .description-text{display:grid;gap:20px}.detail-copy .package-title{margin-top:32px}.purchase-info{padding-block:16px;border-block:1px solid var(--line);font-size:var(--text-sm)}.project-grid{--od-cols:3;--od-gap:24px}.project-panel{padding:32px;border:1px solid var(--border);border-radius:var(--radius-lg);display:grid;align-content:start;gap:20px;background:var(--bg)}.project-number{font:650 var(--text-sm)/1.5 var(--font-mono);color:var(--fg-2)}.project-panel h3{font-size:var(--text-xl);line-height:1.25}.project-panel>p:not(.project-number){color:var(--fg-2)}.projects-section{padding-top:0}.payment-section .help-strip{margin-bottom:64px}.request-total{gap:8px}.request-total>span{color:var(--fg-2);font-size:var(--text-sm)}.request-total strong{font-size:var(--text-2xl);line-height:1.2}.payment-choice{padding:20px;border:1px solid var(--border);background:var(--bg);border-radius:var(--radius-md);align-items:start;gap:16px}.payment-choice .od-field{gap:8px}.payment-choice .od-field span{font-size:var(--text-sm);color:var(--fg-2)}.payment-mark{display:block;flex:none}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-block:40px 64px}.contact-panel{display:grid;align-content:start;gap:20px;padding:32px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--bg)}.contact-panel h2{font-size:var(--text-2xl);line-height:1.2}.contact-panel>p:not(.eyebrow){max-width:55ch;color:var(--fg-2)}.contact-panel.payment-panel{background:var(--surface-warm)}.faq-list{max-width:800px}.faq-list details{border-bottom:1px solid var(--line);padding-block:8px}.faq-list summary{min-height:60px;cursor:pointer;font-weight:650;padding-block:16px;padding-right:16px}.faq-list details>p{color:var(--fg-2);padding:0 24px 24px 0;max-width:70ch}.prepared-items{display:grid;gap:16px;width:100%}.prepared-items h2{font-size:var(--text-xl);margin-bottom:8px}.prepared-items .summary-product{border-bottom:1px solid var(--border);padding-bottom:16px}.summary-panel>.od-row strong{font-size:var(--text-sm)}.nav a{overflow-wrap:normal}.announcement .container{padding-block:4px}
@media(hover:hover){.faq-list summary:hover{color:var(--ink-orange)}}
@media(max-width:1023px){.project-grid{--od-gap:16px}.project-panel{padding:24px}.products{--od-cols:3}.product-price-row{flex-direction:column;align-items:stretch}.product-price-row .price{font-size:var(--text-sm)}.contact-panel{padding:24px}.contact-panel h2{font-size:32px}.nav .nav-links{gap:16px}.nav a{font-size:var(--text-xs)}}
@media(max-width:767px){.products{--od-cols:1;--od-gap:24px;max-width:480px;margin-inline:auto}.product{padding:12px}.product h3{font-size:var(--text-xl)}.product-price-row{flex-direction:row;align-items:center}.product-price-row .price{font-size:var(--text-base)}.product-price-row .add-btn{width:44px;border-radius:50%}.product-price-row .add-btn::before{content:none}.product-options{font-size:var(--text-base)}.project-grid{--od-cols:1;--od-gap:16px}.project-panel{padding:24px}.contact-grid,.detail-copy{grid-template-columns:1fr;gap:24px}.contact-grid{margin-block:32px 48px}.contact-panel h2{font-size:32px}.detail-price strong{font-size:28px}.detail-info h1{font-size:32px}.payment-section .help-strip{margin-bottom:48px}.hero-copy h1{font-size:clamp(38px,8vw,60px)}.nav .nav-links{gap:0}.nav a{font-size:var(--text-sm)}.summary-panel .price{font-size:var(--text-base)}.request-total strong{font-size:32px}.prepared-items .summary-product{font-size:var(--text-base)}.contact-panel .eyebrow{font-size:var(--text-xs)}.basket-item{grid-template-columns:88px minmax(0,1fr)}.basket-body .price{font-size:var(--text-sm)}}

/* Learning: translated editorial blocks, preserving the Creative shop system. */
.video-section{background:var(--bg);border-block:1px solid var(--border)}
.learning-caption{max-width:36ch;color:var(--fg-2);font-size:var(--text-sm);line-height:1.6}
.learning-excerpt{font-size:var(--text-base);line-height:1.6;color:var(--fg-2)}
.guide-card{grid-template-rows:auto auto auto 1fr auto;gap:16px}.guide-card h3{font-size:var(--text-xl);max-width:none;line-height:1.35}.guide-card .eyebrow{font-size:var(--text-xs)}
.video-card{grid-template-rows:auto auto 1fr auto}.video-thumb{position:relative}.video-thumb img{border:1px solid var(--border)}
.video-play{display:grid;place-items:center;position:absolute;bottom:16px;right:16px;width:56px;height:56px;border-radius:var(--radius-pill);background:var(--fg);color:var(--surface);box-shadow:var(--elev-raised)}.video-play svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2}
.learning-article .article-heading{max-width:880px}.learning-article h1,.video-page h1{font-size:clamp(32px,4vw,56px);line-height:1.15;max-width:22ch;overflow-wrap:break-word}.article-image{max-width:960px;border-radius:var(--radius-lg);margin-block:32px 48px}.article-body{max-width:72ch;display:grid;gap:32px}.article-body section{display:grid;gap:16px}.article-body h2{font-size:var(--text-xl);line-height:1.35}.article-body p{line-height:1.7}.article-note,.video-information{color:var(--fg-2);font-size:var(--text-sm)}.article-note{border-block:1px solid var(--line);padding-block:24px}.article-body .od-cluster,.video-page>.od-cluster{gap:24px}.lesson-player{display:block;width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:var(--radius-md);background:var(--fg);margin-block:32px}.video-information{display:grid;gap:16px;max-width:72ch;margin-bottom:32px}.video-page .page-intro{max-width:70ch}.guide-card:focus-visible{outline:3px solid var(--fg);outline-offset:8px;border-radius:var(--radius-sm)}
@media(hover:hover){.guide-card:hover h3{color:var(--ink-orange)}.video-card:hover .video-play{background:var(--accent);color:var(--fg)}}
@media(min-width:768px) and (max-width:1023px){.guide-grid{--od-gap:20px}.guide-card h3{font-size:var(--text-lg)}.learning-caption{max-width:28ch}}
@media(max-width:767px){.guide-grid{--od-cols:1;--od-gap:40px}.video-play{width:48px;height:48px;bottom:12px;right:12px}.article-image{margin-block:24px 32px}.article-body{gap:24px}.lesson-player{margin-block:24px}.learning-article h1,.video-page h1{font-size:32px}.learning-caption{max-width:none}.guide-card{gap:12px}}