:root{
  --bg:#0C0A08;
  --bg-glass:rgba(12,10,8,.96);
  --surface:#15120F;          
  --surface-2:#1D1915;
  --photo-bg:#000000;         
  --ink:#F2EADD;              
  --ink-soft:#D8CDBC;         
  --dim:#A2957F;              
  --gold:#C9A227;
  --gold-lit:#E8C87A;
  --gold-glow:rgba(232,190,110,.45);   
  --on-gold:#0C0A08;          
  --line:rgba(242,234,221,.14);
  --line-strong:rgba(242,234,221,.30);
  --line-gold:rgba(201,162,39,.60);
  --line-green:#06C755;       
  --line-green-hover:#05B34C;
  --white:#FFFFFF;
  --shadow:0 10px 30px rgba(0,0,0,.45);

  --serif:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --sans:"Zen Kaku Gothic New","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",system-ui,sans-serif;

  --t-body:16px;
  --t-small:14px;
  --t-note:13px;
  --t-h1:30px;
  --t-h2:26px;
  --t-h3:19px;
  --t-price:34px;

  --hd-h:60px;
  --pad:20px;                 
  --sec:72px;                 
  --max:1080px;
  --measure:36em;             
  --radius:6px;
}
@media (min-width:768px){
  :root{ --t-body:17px; --t-small:15px; --t-h1:34px; --t-h2:32px; --t-h3:20px; --t-price:40px;
         --pad:32px; --sec:96px; }
}
@media (min-width:1200px){
  :root{ --t-h1:46px; --t-h2:36px; }
}


*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;
  scroll-padding-top:calc(var(--hd-h) + 20px);scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){ html{scroll-behavior:auto} }
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);
  font-size:var(--t-body);line-height:1.8;letter-spacing:.02em;
  line-break:strict;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased}
body.dock-on{padding-bottom:84px}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
p{margin:0}
p,dd,li{text-wrap:pretty}
h1,h2,h3{margin:0;font-weight:600;line-height:1.45}
h1,h2{font-family:var(--serif);letter-spacing:.04em;font-feature-settings:"palt"}
h1{font-size:var(--t-h1)}
h2{font-size:var(--t-h2)}
h3{font-family:var(--sans);font-size:var(--t-h3);font-weight:700;letter-spacing:.02em}
ul,ol,dl,dd{margin:0;padding:0}
ul,ol{list-style:none}
strong,b{font-weight:700;color:var(--ink)}

.ph{display:inline-block}
:focus-visible{outline:2px solid var(--gold-lit);outline-offset:3px;border-radius:2px}
.num{font-variant-numeric:lining-nums tabular-nums}

.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
.skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--gold);color:var(--on-gold);
  padding:12px 16px;text-decoration:none;font-weight:700}
.skip:focus{left:12px;top:12px}


.hd{position:sticky;top:0;z-index:50;background:var(--bg-glass);border-bottom:1px solid var(--line)}
.hd .bar{height:var(--hd-h);display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{font-family:var(--serif);font-size:20px;font-weight:600;letter-spacing:.08em;
  text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.hd nav{display:flex;align-items:center;gap:4px}
.hd .links{display:none}
.hd .links a{font-size:var(--t-small);color:var(--ink-soft);text-decoration:none;
  min-height:44px;display:inline-flex;align-items:center;padding-inline:12px}
.hd .links a:hover{color:var(--ink)}
.hd-link{font-size:var(--t-small);color:var(--ink-soft);text-decoration:none;min-height:44px;display:inline-flex;align-items:center}
.hd-link:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
@media (min-width:960px){ .hd .links{display:flex} .hd nav{gap:12px} }

.crumb{position:relative;z-index:2}
.crumb .wrap{display:flex;justify-content:space-between;align-items:center;gap:16px}
.crumb a{font-size:var(--t-small);color:var(--ink-soft);text-decoration:none;
  min-height:44px;display:inline-flex;align-items:center}
.crumb a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:4px}


.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:48px;padding:10px 22px;border-radius:var(--radius);border:1px solid transparent;
  font-family:var(--sans);font-size:16px;font-weight:700;letter-spacing:.04em;line-height:1.4;
  text-decoration:none;cursor:pointer;transition:background-color .15s ease,border-color .15s ease,color .15s ease}
.btn-primary{background:var(--gold);color:var(--on-gold)}
.btn-primary:hover{background:var(--gold-lit)}
.btn-line{background:var(--line-green);color:var(--white)}
.btn-line:hover{background:var(--line-green-hover)}
.btn-outline{background:transparent;color:var(--ink);border-color:var(--line-strong)}
.btn-outline:hover{border-color:var(--ink-soft)}
.btn-sm{min-height:44px;padding:8px 16px;font-size:14px}
.btn[aria-disabled="true"]{opacity:.45;pointer-events:none}
.text-link{display:inline-flex;align-items:center;min-height:44px;color:var(--ink);
  font-size:16px;text-decoration:underline;text-decoration-color:var(--line-strong);text-underline-offset:5px;
  background:none;border:0;padding:0;font-family:var(--sans);cursor:pointer}
.text-link:hover{text-decoration-color:var(--ink)}
.btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}


.sec{padding-block:var(--sec);border-top:1px solid var(--line)}
.sec-head{max-width:var(--measure);margin-bottom:32px}
.sec-head h2 + p{margin-top:14px;color:var(--ink-soft)}
.prose{max-width:var(--measure);color:var(--ink-soft)}
.prose + .prose{margin-top:1em}
.note{font-size:var(--t-note);color:var(--dim);line-height:1.7}
.mock{font-size:var(--t-note);color:var(--dim);margin-top:8px}
.kicker{font-size:var(--t-small);font-weight:700;color:var(--gold-lit);letter-spacing:.04em;margin-bottom:12px}


.photo img{width:100%;border-radius:4px}
.photo-dark{background:var(--photo-bg);border-radius:4px}


.hero{position:relative}
.hero-vis{position:relative;margin:0}
.hero-vis img{width:100%;height:auto}
.hero-vis::after{content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(to bottom,var(--bg) 0%,transparent 10%,transparent 58%,var(--bg) 100%)}
.hero-vis .mock{position:absolute;right:var(--pad);top:8px;margin:0;z-index:1}
.hero .wrap{position:relative;z-index:1}
.hero-copy{margin-top:-40px;padding-bottom:56px}
.hero-copy h1{margin-bottom:16px}
.hero-copy .lead{color:var(--ink-soft);max-width:var(--measure)}
.hero-copy p,.sec-head p,.pick p,.story p,.lead-strong{word-break:auto-phrase}
.price-line{margin-top:24px;padding-top:20px;border-top:1px solid var(--line)}
.price-line .p{font-size:var(--t-price);font-weight:700;line-height:1.2;letter-spacing:.01em}
.price-line .p small{font-size:16px;font-weight:500;color:var(--ink-soft);margin-left:6px}
.price-line .inc{margin-top:6px;color:var(--ink-soft)}
.hero-copy .btn-row{margin-top:24px}
@media (min-width:768px){
  .hero{min-height:620px;display:flex;align-items:center}
  .hero .wrap{width:100%}
  .hero-copy{margin-top:0;padding-block:56px 64px;max-width:46%}
  .hero-vis{position:absolute;top:0;bottom:0;right:max(0px,calc((100% - var(--max)) / 2));
    width:calc(min(100%,var(--max)) * .54)}
  .hero-vis img{height:100%;object-fit:cover;object-position:45% 50%}
  .hero-vis::after{background:
    linear-gradient(to right,var(--bg) 0%,transparent 26%,transparent 84%,var(--bg) 100%),
    linear-gradient(to bottom,var(--bg) 0%,transparent 12%,transparent 82%,var(--bg) 100%)}
  .hero-vis .mock{right:16px;top:auto;bottom:12px}
  
  .hero.landscape .hero-vis{top:50%;bottom:auto;transform:translateY(-50%)}
  .hero.landscape .hero-vis img{height:auto}
}
@media (min-width:1100px){ .hero{min-height:680px} .hero-copy{max-width:46%} }

.hero.tall .hero-vis{padding-top:12px}
.hero.tall .hero-vis::after{display:none}
.hero.tall .hero-vis img{width:auto;max-width:100%;height:min(420px,108vw);margin-inline:auto;border-radius:4px}
.hero.tall .hero-copy{margin-top:0;padding-top:24px}
.hero.tall .hero-vis .mock{position:static;text-align:center;margin-top:6px}
@media (min-width:768px){
  .hero.tall .hero-vis{top:40px;bottom:40px;padding-top:0}
  .hero.tall .hero-vis img{width:auto;height:100%;max-width:100%;object-fit:contain;margin-inline:auto}
  .hero.tall .hero-copy{margin-top:0;padding-top:56px}
  .hero.tall .hero-vis{bottom:64px}
  .hero.tall .hero-vis .mock{position:absolute;top:100%;bottom:auto;left:0;right:0}
}


.hero.square .hero-vis::after{background:linear-gradient(to bottom,var(--bg) 0%,transparent 5%,transparent 72%,var(--bg) 100%)}
.hero.square .hero-copy{margin-top:0}
.hero.square .hero-vis .mock{position:static;padding-inline:var(--pad);text-align:right;margin-top:-6px}
@media (min-width:768px){
  .hero.square .hero-vis::after{background:
    linear-gradient(to right,var(--bg) 0%,transparent 10%,transparent 90%,var(--bg) 100%),
    linear-gradient(to bottom,var(--bg) 0%,transparent 4%,transparent 82%,var(--bg) 100%)}
  .hero.square .hero-copy{margin-top:0}
  .hero.square .hero-vis .mock{position:absolute;top:auto;bottom:12px;right:16px;padding:0;margin:0}
}


.hero.real .hero-vis{padding-top:8px}
.hero.real .hero-vis::after{display:none}
.hero.real .hero-vis img{width:auto;max-width:100%;height:min(470px,122vw);margin-inline:auto;object-fit:contain;
  -webkit-mask-image:linear-gradient(to right,transparent 0,black 9%,black 86%,transparent 100%),linear-gradient(to bottom,transparent 0,black 5%,black 80%,transparent 100%);
  -webkit-mask-composite:source-in;
  mask-image:linear-gradient(to right,transparent 0,black 9%,black 86%,transparent 100%),linear-gradient(to bottom,transparent 0,black 5%,black 80%,transparent 100%);
  mask-composite:intersect}
.hero.real .hero-copy{margin-top:0;padding-top:12px}
.hero.real .hero-vis .mock{position:static;text-align:center;margin-top:2px}
@media (min-width:768px){
  .hero.real .hero-vis{top:24px;bottom:40px;padding-top:0}
  .hero.real .hero-vis img{height:100%}
  .hero.real .hero-copy{padding-top:56px}
  .hero.real .hero-vis .mock{position:absolute;top:100%;bottom:auto;left:0;right:0}
}


.band{border-block:1px solid var(--line);background:var(--surface)}
.points{display:grid}
.points div{padding-block:16px}
.points div + div{border-top:1px solid var(--line)}
.points dt{font-weight:700}
.points dd{color:var(--ink-soft);margin-top:2px}
.points dd a{color:var(--ink);margin-left:.4em}
@media (min-width:768px){
  .points{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .points div{padding-block:24px}
  .points div + div{border-top:0}
}


.eng-grid{display:grid;gap:32px}
.plate{position:relative;margin:0;width:min(64%,300px);container-type:inline-size}
.plate img{width:100%;border-radius:2px;transition:opacity .2s ease}
.plate img.swapping{opacity:.35}
.plate .layer{position:absolute;left:0;right:0;top:60%;padding-inline:10%;text-align:center;pointer-events:none}
.plate .layer > span{display:block}
.plate .awarded{font-family:var(--serif);font-size:3cqi;letter-spacing:.3em;color:var(--gold-lit);margin-bottom:2cqi}
.plate .name{font-family:var(--serif);font-weight:600;font-size:8.5cqi;line-height:1.25;letter-spacing:.06em;
  color:var(--gold-lit);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.plate .rule{height:1px;background:var(--line-gold);margin:3cqi auto 0;max-width:70%}
.plate .date{font-family:var(--serif);font-size:3.2cqi;letter-spacing:.18em;color:var(--gold-lit);margin-top:2.5cqi}

.controls{display:grid;gap:22px;max-width:30em}
.field label,.field legend{display:block;font-weight:700;margin-bottom:8px;padding:0}
.field fieldset{border:0;margin:0;padding:0;min-width:0}
.scene-pick{display:flex;flex-wrap:wrap;gap:8px}
.scene-pick button{min-height:44px;padding:8px 12px;border-radius:var(--radius);border:1px solid var(--line-strong);
  background:transparent;color:var(--ink-soft);font-family:var(--sans);font-size:15px;cursor:pointer}
.scene-pick button[aria-pressed="true"]{border-color:var(--gold);color:var(--ink);background:var(--surface-2)}
.field input[type="text"]{width:100%;min-height:52px;padding:10px 14px;border-radius:var(--radius);
  border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);
  font-family:var(--sans);font-size:18px}
.field input[type="text"]::placeholder{color:var(--dim)}
.field input[type="text"]:focus{border-color:var(--gold-lit)}
.field .note{margin-top:8px}

.items{margin-top:44px;max-width:var(--measure)}
.items h3{margin-bottom:12px}
.items dl{border-top:1px solid var(--line)}
.items dl div{padding-block:14px;border-bottom:1px solid var(--line)}
.items dt{font-weight:700}
.items dd{margin-top:4px;color:var(--ink-soft)}
.items .note{margin-top:12px}
@media (min-width:768px){
  .eng-grid{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:40px;align-items:start}
  .plate{width:100%;max-width:360px}
  .items{margin-top:40px}
}

@media (min-width:1100px){ .eng-grid{gap:64px} }


.gallery{display:grid;gap:24px}
.gallery figure{margin:0}
.gallery figcaption{margin-top:8px;font-size:var(--t-small);color:var(--ink-soft)}
.gallery figcaption .mock{display:inline;margin:0 0 0 .5em}
@media (min-width:768px){ .gallery{grid-template-columns:1fr 1fr} }

.spec-wrap{display:grid;gap:40px;margin-top:48px}
@media (min-width:900px){ .spec-wrap{grid-template-columns:minmax(0,7fr) minmax(0,4fr);gap:56px;align-items:start} }
.spec{width:100%;border-collapse:collapse;font-size:var(--t-body)}
.spec caption{text-align:left;font-weight:700;font-size:var(--t-h3);margin-bottom:12px}
.spec th,.spec td{padding:14px 0;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.spec tr:first-child th,.spec tr:first-child td{border-top:1px solid var(--line)}
.spec th{width:8em;padding-right:16px;font-weight:700;color:var(--ink-soft);white-space:nowrap}
.spec td{color:var(--ink)}
@media (max-width:420px){ .spec th{width:6.5em} }

.scale{padding:20px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface)}
.scale h3{font-size:16px;margin-bottom:16px}
.scale-row{display:flex;align-items:flex-end;gap:20px;flex-wrap:wrap}
.scale-obj{display:flex;flex-direction:column;align-items:flex-start;gap:8px}
.scale-box{border:1px solid var(--line-strong);border-radius:6px;background:var(--bg)}
.scale-box.hl{border-color:var(--gold);border-radius:2px}
.scale-obj span{font-size:var(--t-note);color:var(--ink-soft);line-height:1.5}
.scale .note{margin-top:14px}


.steps{counter-reset:step;max-width:46em;border-top:1px solid var(--line)}
.steps > li{counter-increment:step;display:grid;grid-template-columns:40px minmax(0,1fr);gap:0 16px;
  padding-block:24px;border-bottom:1px solid var(--line)}
.steps > li::before{content:counter(step);grid-row:1 / span 2;width:36px;height:36px;border-radius:50%;
  border:1px solid var(--line-gold);color:var(--gold-lit);display:grid;place-items:center;
  font-weight:700;font-size:16px;font-variant-numeric:lining-nums}
.steps h3{margin-bottom:10px;padding-top:4px}
.steps dl{display:grid;gap:8px}
.steps dl div{display:grid;grid-template-columns:5.5em minmax(0,1fr);gap:0 8px}
.steps dt{font-size:var(--t-small);font-weight:700;color:var(--dim);padding-top:2px}
.steps dt.us{color:var(--gold-lit)}
.steps dd{color:var(--ink-soft)}
@media (max-width:420px){ .steps dl div{grid-template-columns:1fr} .steps dt{padding-top:0} }


.addr{display:grid;gap:28px;margin-top:48px;padding:24px 20px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface)}
.addr-sec{margin-top:0}
.addr h2,.addr h3{margin-bottom:10px}
.addr-lead{color:var(--ink-soft);max-width:var(--measure)}
.addr-steps{counter-reset:a;margin-top:18px;display:grid;gap:14px}
.addr-steps li{counter-increment:a;position:relative;padding-left:40px;color:var(--ink-soft)}
.addr-steps li::before{content:counter(a);position:absolute;left:0;top:0;width:28px;height:28px;border-radius:50%;
  border:1px solid var(--line-gold);color:var(--gold-lit);display:grid;place-items:center;font-size:14px;font-weight:700;font-variant-numeric:lining-nums}
.addr-steps b{display:block}
.phone{margin:0;justify-self:center;width:min(100%,260px)}
.phone-screen{border:1px solid var(--line-strong);border-radius:22px;padding:22px 16px 18px;background:var(--bg);display:grid;gap:10px}
.pf-title{font-size:var(--t-note);font-weight:700;line-height:1.5}
.pf-note{font-size:var(--t-note);color:var(--gold-lit);border:1px solid var(--line-gold);border-radius:4px;padding:6px 8px;line-height:1.5}
.pf-field{display:grid;gap:4px}
.pf-field span{font-size:var(--t-note);color:var(--ink-soft)}
.pf-field i{display:block;height:28px;border:1px solid var(--line-strong);border-radius:4px;font-style:normal;font-size:var(--t-note);padding:4px 8px;color:var(--ink)}
.pf-field i.tall{height:44px}
.pf-send{justify-self:start;margin-top:4px;font-size:var(--t-note);font-weight:700;color:var(--on-gold);background:var(--gold);border-radius:4px;padding:4px 14px}
.phone .mock{text-align:center}
@media (min-width:768px){
  .addr{grid-template-columns:minmax(0,1fr) 260px;gap:40px;padding:32px;align-items:center}
  .phone{justify-self:end}
}


.price-grid{display:grid;gap:40px}
@media (min-width:960px){ .price-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start} }
.block + .block{margin-top:36px}
.block h3{margin-bottom:12px}
.ticks li{position:relative;padding-left:1.4em;color:var(--ink-soft)}
.ticks li + li{margin-top:8px}
.ticks li::before{content:"";position:absolute;left:.1em;top:.8em;width:.6em;height:1px;background:var(--gold)}
.plain li{padding-block:12px;border-bottom:1px solid var(--line);color:var(--ink-soft)}
.plain li:first-child{border-top:1px solid var(--line)}
.plain b{display:block;color:var(--ink)}
.caution{padding:18px 20px;border:1px solid var(--line-strong);border-radius:var(--radius)}
.caution h3{font-size:16px;margin-bottom:6px}
.caution p{color:var(--ink-soft)}

.calc{padding:24px 20px;border:1px solid var(--line-gold);border-radius:var(--radius);background:var(--surface)}
@media (min-width:768px){ .calc{padding:32px} }
.calc h3{margin-bottom:6px}
.calc .cap{color:var(--ink-soft)}
.calc .fld{margin-top:22px}
.calc label{display:block;font-weight:700}
.calc .hint{font-size:var(--t-note);color:var(--dim);margin-top:2px}
.qty{display:flex;align-items:stretch;margin-top:10px;width:max-content;border:1px solid var(--line-strong);border-radius:var(--radius);overflow:hidden}
.qty button{width:52px;min-height:52px;background:var(--surface-2);border:0;color:var(--ink);font-size:22px;cursor:pointer;font-family:var(--sans)}
.qty button:hover{background:var(--bg)}
.qty input{width:84px;min-height:52px;border:0;border-inline:1px solid var(--line-strong);background:var(--bg);color:var(--ink);
  text-align:center;font-family:var(--sans);font-size:20px;font-weight:700;font-variant-numeric:lining-nums tabular-nums;
  -moz-appearance:textfield;appearance:textfield}
.qty input::-webkit-outer-spin-button,.qty input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.total{margin-top:24px;border-top:1px solid var(--line)}
.total .li,.total .sum{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap;padding-block:12px}
.total .li{color:var(--ink-soft);font-size:var(--t-small);border-bottom:1px solid var(--line)}
.total .sum{font-weight:700}
.total .sum .v{font-size:30px;line-height:1.2;color:var(--ink)}
.total .fine{font-size:var(--t-note);color:var(--dim)}
.calc .btn-row{margin-top:22px}


.faq{max-width:46em;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;min-height:56px;padding:14px 40px 14px 0;position:relative;
  font-weight:700;display:flex;align-items:center}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";position:absolute;right:8px;top:50%;width:10px;height:10px;
  border-right:2px solid var(--ink-soft);border-bottom:2px solid var(--ink-soft);
  transform:translateY(-70%) rotate(45deg);transition:transform .15s ease}
.faq details[open] summary::after{transform:translateY(-30%) rotate(-135deg)}
.faq .a{padding:0 0 20px;color:var(--ink-soft);max-width:var(--measure)}
.faq .a a{color:var(--ink)}


.consult .btn-row{margin-top:28px}


.ft{border-top:1px solid var(--line);padding-block:28px 40px}
.ft .wrap{display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between;align-items:center}
.ft small{font-size:var(--t-note);color:var(--dim)}
.ft .ft-note{order:3;flex-basis:100%}   
.ft nav{display:flex;flex-wrap:wrap;gap:0 20px}
.ft nav a{font-size:var(--t-note);color:var(--ink-soft);min-height:44px;display:inline-flex;align-items:center}


.dock{position:fixed;left:0;right:0;bottom:0;z-index:40;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px var(--pad) calc(10px + env(safe-area-inset-bottom,0px));
  background:var(--bg-glass);border-top:1px solid var(--line-strong)}
.dock[hidden]{display:none}
.dock .l{font-size:var(--t-note);color:var(--ink-soft);line-height:1.4}
.dock .l b{display:block;font-size:18px;color:var(--ink)}
@media (min-width:900px){ .dock{display:none !important} body.dock-on{padding-bottom:0} }


.entry main{padding-block:40px 64px}
.entry h1{font-size:var(--t-h2)}
.entry .desc{margin-top:14px;color:var(--ink-soft);max-width:var(--measure)}
.entry .lead{margin-top:36px;font-weight:700}
.pair{display:grid;gap:16px;margin-top:14px}
@media (min-width:900px){ .pair{grid-template-columns:1fr 1fr;gap:24px} }
.pick{display:grid;grid-template-columns:minmax(0,36%) minmax(0,1fr);gap:16px;align-items:start;
  padding:14px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);
  text-decoration:none;transition:border-color .15s ease}
.pick:hover{border-color:var(--gold)}
.pick figure{margin:0}
.pick .ph-box{aspect-ratio:4/5;overflow:hidden;border-radius:3px}
.pick .ph-box img{width:100%;height:100%;object-fit:cover}
.pick .ph-box.dark{background:var(--photo-bg)}
.pick .ph-box.dark img{object-fit:contain}
.pick figcaption{font-size:var(--t-note);color:var(--dim);margin-top:4px}
.pick h2,.pick h3{font-family:var(--serif);font-weight:600;font-size:19px;line-height:1.45;letter-spacing:.02em}
.pick .diff{margin-top:8px;color:var(--ink);line-height:1.7}
.pick .scene{margin-top:8px;color:var(--ink-soft);line-height:1.7}
.pick .go{margin-top:12px;display:inline-flex;align-items:center;min-height:32px;font-size:var(--t-small);font-weight:700;color:var(--gold-lit)}
@media (min-width:600px){ .pick{padding:20px;gap:24px} .pick h2,.pick h3{font-size:22px} }
.entry .both{margin-top:20px}


.designs{display:grid;gap:0;border-top:1px solid var(--line)}
.design{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-content:start;align-items:start;padding-block:18px;border-bottom:1px solid var(--line);margin:0}
.design .photo-dark img{width:100%}
.design h3{font-size:18px;margin-bottom:6px}
.design dl div + div{margin-top:6px}
.design dt{font-size:var(--t-note);font-weight:700;color:var(--dim)}
.design dd{color:var(--ink-soft);line-height:1.7}
@media (min-width:900px){
  .designs{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;border-top:0}
  .design{grid-template-columns:1fr;border-bottom:0;padding-block:0}
  .design h3{margin-top:4px}
}
.designs + .mock{margin-top:16px}
.cross{margin-top:28px;max-width:var(--measure);padding:16px 20px;border-left:2px solid var(--line-gold);background:var(--surface);color:var(--ink-soft)}
.cross a{color:var(--ink)}



.about-hero{padding-block:40px 64px}
.about-hero h1{margin-bottom:24px}
.scene{margin:40px 0 0;max-width:880px}
.scene img{width:100%;border-radius:4px}
.sec-head + .scene{margin-top:8px;margin-bottom:40px}
.story{max-width:var(--measure);display:grid;gap:1.1em;color:var(--ink-soft)}
.story strong{color:var(--ink)}
.alone{margin-top:40px;max-width:46em}
.alone h3{margin-bottom:12px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips li{padding:6px 12px;border:1px solid var(--line-strong);border-radius:999px;font-size:var(--t-small);color:var(--ink-soft)}
.alone .note{margin-top:12px}
.why{max-width:46em}
.lead-strong{margin-top:32px;max-width:var(--measure);font-family:var(--serif);font-size:20px;line-height:1.8;letter-spacing:.04em}
.roles{display:grid;gap:28px;max-width:52em}
.roles h3{margin-bottom:10px}
.roles-note{margin-top:24px;max-width:var(--measure)}
.roles-note a{color:var(--ink-soft)}
.about .consult .pair{margin-top:0}
.about .consult .btn-row{margin-top:28px}
@media (min-width:768px){ .about-hero{padding-block:64px 88px} .roles{grid-template-columns:1fr 1fr;gap:48px} }


.lv-wrap{display:grid;justify-items:center;gap:32px;text-align:center}
.lv-note{font-size:clamp(21px,5.6vw,32px)}
.lv-stage{position:relative;width:min(64vw,240px)}
.lv-big{width:100%;height:auto;display:block}
.lv-emb{-webkit-mask-image:radial-gradient(closest-side,#000 72%,transparent 100%);
  mask-image:radial-gradient(closest-side,#000 72%,transparent 100%);
  filter:brightness(.42) saturate(.55)}
.lv-caps{margin-top:22px;height:1.6em;position:relative}
.lc{position:absolute;inset:0;font-size:var(--t-h2);font-weight:700;letter-spacing:.08em;color:var(--dim);opacity:0;font-variant-numeric:lining-nums}
.lc1{opacity:1}
.lc5{color:var(--gold-lit)}
.lv-stage.in .lv-grow{animation:lvScale 7s ease-out both,lvGlow 7s linear both}
.lv-stage.in .lc{animation:lvF 7s linear both}
.lv-stage.in .lc1{animation-name:lvF1}
.lv-stage.in .lc2{animation-name:lvF2}
.lv-stage.in .lc3{animation-name:lvF3}
.lv-stage.in .lc4{animation-name:lvF4}
.lv-stage.in .lc5{animation-name:lvF5}
@keyframes lvScale{0%{transform:scale(.86)}100%{transform:scale(1)}}
@keyframes lvGlow{
  0%,16%{filter:brightness(.42) saturate(.55)}
  21%,36%{filter:brightness(.56) saturate(.68)}
  41%,56%{filter:brightness(.7) saturate(.8)}
  61%,76%{filter:brightness(.85) saturate(.9)}
  81%,100%{filter:brightness(1.05) saturate(1) drop-shadow(0 0 18px var(--gold-glow))}}
@keyframes lvF1{0%,16%{opacity:1}21%,100%{opacity:0}}
@keyframes lvF2{0%,16%{opacity:0}21%,36%{opacity:1}41%,100%{opacity:0}}
@keyframes lvF3{0%,36%{opacity:0}41%,56%{opacity:1}61%,100%{opacity:0}}
@keyframes lvF4{0%,56%{opacity:0}61%,76%{opacity:1}81%,100%{opacity:0}}
@keyframes lvF5{0%,76%{opacity:0}81%,100%{opacity:1}}
@media (prefers-reduced-motion:reduce){
  .lv-emb{filter:brightness(1.05) saturate(1)}
  .lc{opacity:0}.lc5{opacity:1}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none !important;animation:none !important}
}