/* Oskar's red and blue identity, with an editorial textile layout. */
:root{--red:#e52636;--blue:#234ce2;--navy:#111d35;--paper:#f8f9fc}
body{background:var(--paper)}
.header{background:#f8f9fcf2;height:88px}
.brand{min-width:185px;display:block}
.brand img{width:185px;height:auto;object-fit:contain}
.footer .brand img{width:164px;height:auto}
.reading-progress{position:absolute;left:0;right:0;bottom:-1px;height:2px;overflow:hidden}
.reading-progress span{display:block;height:100%;background:var(--blue);transform:scaleX(0);transform-origin:left}
.nav a:hover{color:var(--blue)}
.count{background:var(--blue);color:#fff}
.hero{grid-template-columns:1.03fr 1fr;gap:56px;padding-block:58px 34px;min-height:690px}
.hero-copy{position:relative;z-index:2}
.hero-copy .eyebrow{font-size:11px;letter-spacing:.12em;color:var(--muted);margin-bottom:27px}
.live-dot{background:var(--red);box-shadow:0 0 0 4px #e5263610}
.hero h1{font-size:clamp(54px,5.1vw,76px);font-weight:500;letter-spacing:-.058em;line-height:1.1}
.hero h1>span{display:block}
.hero h1 .hero-last{white-space:nowrap;letter-spacing:-.058em}
.hero h1 em{color:var(--red);font-size:1.16em;letter-spacing:-.035em;font-weight:500}
.hero-description{font-size:16px;line-height:1.85;margin-top:27px}
.hero-actions{margin-top:27px;gap:24px}
.button{border-radius:2px;min-height:56px;font-size:14px;transition:background .3s,transform .3s,box-shadow .3s}
.button-dark{background:var(--blue);color:#fff}
.button-dark:hover{background:#193abc;box-shadow:0 8px 24px #234ce218}
.button-lime{background:#fff;color:var(--navy)}
.button-lime:hover{background:var(--blue);color:#fff}
.text-link:hover{color:var(--blue)}
.hero-bottom{margin-top:32px;font-size:12px;line-height:1.65}
.small-icon{border-color:#c7d0e2;color:var(--blue);width:42px;height:42px}
.hero-art{padding-left:0;isolation:isolate}
.hero-art:before{content:"";position:absolute;inset:-16px 22px 49px -16px;border:1px solid #234ce225;border-radius:4px;z-index:-1;transform:rotate(-3deg)}
.hero-photo{height:570px;min-height:0;border-radius:3px;background:#e8edf4}
.hero-photo img{object-position:center 50%}
.photo-label{background:#ffffffdc;left:20px;right:20px;bottom:20px;border-radius:2px;font-size:10px;padding:16px;color:var(--navy)}
.label-dot{background:var(--red);border-radius:0;width:7px;height:7px}
.hero-stamp{width:108px;height:108px;left:-31px;bottom:102px;background:var(--navy);color:#fff;border-radius:50%;transform:none;gap:8px;box-shadow:0 8px 24px #111d351a}
.hero-stamp img{width:43px;height:43px;filter:brightness(0) invert(1);will-change:transform}
.hero-stamp span{font-size:8px;text-align:center;line-height:1.65;letter-spacing:.14em}
.art-index{font-size:10px;margin-top:17px;letter-spacing:.12em}
.collection-strip{margin-block:20px 56px;border-color:#cdd5e6}
.collection-strip>span{color:var(--muted);font-size:11px}
.collection-strip a{font-size:26px;padding-block:24px;transition:background .3s,color .3s}
.collection-strip a:hover{background:#eaf0ff;color:var(--blue)}
.collection-strip a>span{color:var(--blue)}
.texture-stage{background:#111d35;position:relative}
.motion .texture-pin{top:88px;height:calc(100svh - 88px)}
.texture-visual{border-radius:3px;height:100%;max-height:600px}
.scene-copy h2 em{color:#a5b8ff}
.scene-tabs button.active{color:#fff;border-color:#6e91ff}
.stage-track span{background:#557cff}
.texture-rail figcaption{background:linear-gradient(transparent,#101b32de);font-size:11px}
.fabric-orbit svg{stroke:#fff}
.section-heading .eyebrow,.color-copy .eyebrow,.faq-intro .eyebrow{color:var(--blue);letter-spacing:.12em}
.section-heading h2,.color-copy h2,.faq-intro h2{font-weight:500}
.section-heading h2 em,.color-copy h2 em,.faq-intro h2 em{color:var(--blue)}
.filters button{border-radius:3px;font-size:13px}
.filters button.active{background:var(--blue);border-color:var(--blue);color:#fff}
.search:focus-within{border-color:var(--blue)}
.product-image{border-radius:3px;aspect-ratio:.92}
.product-type{background:#ffffffea;border-radius:2px;font-size:11px}
.image-arrow{border-radius:3px;background:#fff;color:var(--blue)}
.product-image:hover .image-arrow{background:var(--blue);color:#fff;transform:translate(2px,-2px)}
.product-title h3{font-size:32px;font-weight:500}
.product-title>span{color:var(--blue)}
.product>p{font-size:15px}
.product-bottom{border-color:#cdd5e6}
.color-section{background:#edf1f9}
.color-sample{border-radius:3px;box-shadow:inset 0 0 80px #111d3508}
.palette button{font-size:12px}
.palette button.active>span{outline-color:var(--blue)}
.palette button.active{color:var(--blue)}
.process-grid article{padding-top:30px}
.process-grid svg{stroke:var(--blue);stroke-width:1.25}
.step-number{color:var(--red)}
.process-grid p{font-size:15px}
.faq-list summary{font-size:16px}
.faq-list summary>span{color:var(--blue)}
.brand-ribbon{overflow:hidden;border-block:1px solid var(--line);padding-block:23px;background:#f8f9fc}
.ribbon-track{display:flex;align-items:center;width:max-content}
.ribbon-group{display:flex;align-items:center;gap:54px;padding-right:54px}
.ribbon-group>span{font-size:24px;letter-spacing:-.035em;font-weight:500;white-space:nowrap;color:var(--navy)}
.ribbon-track img{width:26px;height:26px}
.motion .ribbon-track{animation:ribbon-move 38s linear infinite}
.brand-ribbon:hover .ribbon-track{animation-play-state:paused}
.contact{background:var(--navy);position:relative;overflow:hidden;padding-block:80px}
.contact:after{content:"";position:absolute;width:480px;height:480px;border:1px solid #90aaff18;border-radius:50%;right:-90px;top:-130px;box-shadow:0 0 0 45px #90aaff06,0 0 0 90px #90aaff04;pointer-events:none}
.contact-inner{position:relative;z-index:1}
.contact h2 em{color:#a5b8ff}
.contact h2 svg{stroke:#a5b8ff}
.contact-bottom .button{background:#fff;color:var(--navy)}
.contact-bottom .button:hover{background:#e5ebff}
.contact .phone{color:#fff;font-size:24px}
.footer p{font-size:12px;max-width:330px}
dialog{border-radius:6px;background:#f8f9fc}
dialog::backdrop{background:#08132bb5}
.close-button{background:#e7edfb;color:var(--navy)}
.close-button:hover{background:#dce5ff;color:var(--blue)}
.spec-note{background:#edf1f9}
input:not([type="search"]),textarea{background:#fff}
.quantity button{background:#e7edfb;color:var(--blue)}
.list-dialog h2>span{color:var(--red)}
.toast{background:var(--blue);color:#fff;border-radius:3px}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline-color:var(--blue)}
@keyframes ribbon-move{to{transform:translateX(-50%)}}
@keyframes art-enter{from{opacity:0;transform:translateY(24px);clip-path:inset(5% 0 0 0)}to{opacity:1;transform:translateY(0);clip-path:inset(-20% -20% -20% -20%)}}
@media(min-width:1500px){.hero{padding-top:72px}.hero-photo{height:620px}}
@media(max-width:1100px){.hero{gap:36px;min-height:0;padding-top:44px}.hero h1{font-size:clamp(45px,5.3vw,58px)}.hero-photo{height:520px}.hero-description{font-size:15px}.hero-actions{gap:18px}.hero-stamp{width:94px;height:94px;left:-20px}.brand{min-width:168px}.brand img{width:168px}}
@media(max-width:860px){.header{height:76px}.hero{gap:26px}.hero h1{font-size:43px}.hero-photo{height:490px}.hero-copy .eyebrow{font-size:10px;letter-spacing:.06em}.hero-actions{flex-direction:column;align-items:flex-start;gap:8px}.hero-stamp{width:84px;height:84px;left:-16px}.hero-stamp img{width:33px;height:33px}.hero-stamp span{font-size:7px}.motion .texture-pin{top:76px;height:calc(100svh - 76px)}}
@media(max-width:700px){
  .header{height:74px;padding-inline:20px;gap:10px}.brand{min-width:144px}.brand img{width:144px;height:auto}.header-actions{gap:7px}.nav{top:74px;background:#f8f9fc}.list-toggle{font-size:12px}
  .hero{display:grid;grid-template-columns:1fr;gap:34px;padding-block:34px 24px;min-height:0}.hero-copy .eyebrow{font-size:10px;letter-spacing:.08em;margin-bottom:21px}
  .hero h1{font-size:clamp(40px,10.65vw,69px);line-height:1.1;letter-spacing:-.055em}.hero h1>span,.hero h1>span:nth-child(2),.hero h1>span:nth-child(3){display:block}.hero h1>span:after{content:none}.hero h1 .hero-last{white-space:nowrap}.hero h1 em{font-size:1.13em}
  .hero-description{font-size:16px;line-height:1.75;margin-top:23px;max-width:28em}.hero-description br{display:none}.hero-actions{flex-direction:row;align-items:center;gap:21px;margin-top:23px}.hero-actions .button{font-size:13px;padding:15px 17px;min-height:54px;gap:17px}.hero-actions .text-link{font-size:13px;gap:8px}
  .hero-art:before{inset:-8px 17px 39px -8px;transform:rotate(-2deg)}.hero-photo{height:425px;min-height:0;border-radius:3px}.hero-photo img{object-position:center 52%}.hero-stamp{width:88px;height:88px;left:auto;right:14px;bottom:94px}.hero-stamp img{width:35px;height:35px}.hero-stamp span{font-size:7px}.photo-label{left:14px;right:14px;bottom:14px;font-size:9px;padding:13px}.art-index{font-size:9px;margin-top:13px}
  .collection-strip{margin-block:15px 38px}.collection-strip a{font-size:22px;padding:20px 12px}.collection-strip sup{font-size:10px}
  .motion .texture-pin{position:relative;top:auto;height:auto;min-height:0}.texture-visual{height:365px;max-height:none;border-radius:3px}.scene-copy p{font-size:16px}.scene-text{min-height:230px}.scene-copy h2{font-size:42px}.scene-tabs{gap:23px}.scene-tabs button{font-size:14px}
  .section-space{padding-block:66px}.section-heading h2,.color-copy h2{font-size:44px}.section-heading>p{font-size:16px}.filters button{font-size:13px;min-height:44px}.product>p{font-size:16px}.product-title h3{font-size:31px}.product-type{font-size:12px}.product-image{aspect-ratio:1.02}.palette button{font-size:12px}
  .process-grid article{padding-top:24px}.process-grid p{font-size:16px}.faq-list details>p{font-size:16px}.faq-list summary{font-size:16px}.brand-ribbon{padding-block:21px}.ribbon-group{gap:30px;padding-right:30px}.ribbon-group>span{font-size:21px}.ribbon-track img{width:22px;height:22px}.contact{padding-block:55px}.contact h2{font-size:44px}.contact-bottom p{font-size:16px}.contact .phone{font-size:23px}.contact:after{right:-230px;top:-40px}
  .footer .brand img{width:144px;height:auto}.footer p{max-width:none}.mobile-dock{background:#f8f9fcf5}.mobile-dock>button{background:var(--blue);color:#fff}.mobile-dock .count{background:#fff;color:var(--blue)}.mobile-dock>a{border-color:#cdd5e6}.modal-photo{border-radius:3px}#modal-description{font-size:16px}
}
@media(max-width:360px){.header{padding-inline:16px}.brand{min-width:128px}.brand img{width:128px}.hero h1{font-size:clamp(34px,10.65vw,39px)}.hero-actions{gap:14px}.hero-actions .button{font-size:12px;padding-inline:13px;gap:13px}.hero-actions .text-link{font-size:12px}.hero-photo{height:370px}.collection-strip a{font-size:20px;padding-inline:9px}.collection-strip sup{display:none}.scene-copy h2{font-size:38px}.scene-text{min-height:250px}.section-heading h2,.color-copy h2{font-size:40px}.filters{gap:6px}.filters button{font-size:12px;padding-inline:11px}.contact h2{font-size:40px}}
@media(prefers-reduced-motion:reduce){.ribbon-track{animation:none!important}.hero-stamp img{transform:none!important}.reading-progress{display:none}}
