:root { --ink:#0b0b0a; --paper:#f1f0e9; --muted:#a7a79e; --line:rgba(255,255,255,.14); --mustard:#d9a928; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; background:var(--ink); }
body { margin:0; background:var(--ink); color:var(--paper); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }

.site-header { position:fixed; z-index:20; inset:0 0 auto; height:82px; padding:0 clamp(22px,4vw,68px); display:grid; grid-template-columns:1fr auto 1fr; align-items:center; border-bottom:1px solid var(--line); background:transparent; }
.brand { justify-self:start; display:inline-flex; align-items:center; gap:11px; font-size:.78rem; font-weight:800; letter-spacing:.18em; }
.brand-mark { display:grid; place-items:center; width:31px; height:31px; border:1px solid var(--mustard); color:var(--mustard); font-size:.76rem; letter-spacing:0; }
nav { display:flex; gap:clamp(24px,3vw,52px); color:var(--muted); font-size:.7rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; }
nav a,.header-action { transition:color 180ms ease; }
nav a:hover,.header-action:hover { color:var(--mustard); }
.header-action { justify-self:end; display:inline-flex; align-items:center; gap:10px; font-size:.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.header-action span { color:var(--mustard); font-size:1rem; }

.scroll-frame { position:fixed; z-index:0; inset:0; width:100%; height:100%; object-fit:cover; pointer-events:none; }
.scroll-video { display:none; }
.video-overlay { position:fixed; z-index:1; inset:0; pointer-events:none; background:rgba(7,7,6,.48); }
.service-section { position:relative; z-index:2; min-height:100vh; padding:128px clamp(24px,7vw,118px) 74px; display:grid; align-items:center; border-bottom:1px solid var(--line); background:transparent; overflow:hidden; }
.section-content { width:min(760px,72vw); }
.align-center .section-content { justify-self:center; text-align:center; }
.align-left .section-content { justify-self:start; text-align:left; }
.align-right .section-content { justify-self:end; text-align:right; }
.eyebrow { margin:0 0 24px; color:var(--mustard); font-size:.7rem; font-weight:800; letter-spacing:.25em; text-transform:uppercase; }
h1 { margin:0; max-width:920px; font-size:clamp(3.5rem,7.6vw,8.5rem); font-weight:750; line-height:.9; letter-spacing:-.065em; text-wrap:balance; }
.description { width:min(550px,100%); margin:34px 0 0; color:var(--muted); font-size:clamp(1rem,1.35vw,1.22rem); line-height:1.65; }
.align-center .description,.align-center .section-actions { margin-left:auto; margin-right:auto; }
.align-right .description,.align-right .section-actions { margin-left:auto; }
.section-actions { margin-top:38px; display:flex; align-items:center; gap:18px; width:fit-content; }
.primary-button { min-height:54px; padding:0 22px; display:inline-flex; align-items:center; gap:28px; background:var(--mustard); color:var(--ink); font-size:.72rem; font-weight:850; letter-spacing:.11em; text-transform:uppercase; transition:background 180ms ease,transform 180ms ease; }
.primary-button:hover { background:#efbd35; transform:translateY(-2px); }
.primary-button:focus-visible,nav a:focus-visible,.header-action:focus-visible,.brand:focus-visible { outline:2px solid var(--mustard); outline-offset:4px; }
.support-badge { min-height:34px; padding:0 13px; display:inline-flex; align-items:center; gap:9px; border:1px solid var(--line); border-radius:999px; color:#c6c6bd; font-size:.64rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; white-space:nowrap; }
.support-badge i { width:5px; height:5px; border-radius:50%; background:var(--mustard); box-shadow:0 0 0 4px rgba(217,169,40,.12); }
.section-index { position:absolute; top:50%; left:clamp(18px,3vw,48px); display:flex; flex-direction:column; align-items:center; gap:10px; color:#66665f; font-size:.58rem; font-weight:700; letter-spacing:.08em; transform:translateY(-50%); }
.section-index i { width:1px; height:68px; background:linear-gradient(var(--mustard) 16%,var(--line) 16%); }
.section-note { position:absolute; right:clamp(24px,4vw,68px); bottom:27px; margin:0; color:#65655f; font-size:.58rem; font-weight:700; letter-spacing:.18em; text-transform:uppercase; }
.section-note span { margin:0 7px; color:var(--mustard); }

.details-section,.quality-section { position:relative; z-index:3; isolation:isolate; overflow:hidden; }
.details-section { min-height:100vh; padding:clamp(120px,14vw,210px) clamp(24px,7vw,118px); }
.post-section-number { position:absolute; z-index:-1; top:clamp(90px,8vw,130px); right:clamp(18px,4vw,70px); color:rgba(255,255,255,.055); font-size:clamp(8rem,22vw,25rem); font-weight:900; line-height:.72; letter-spacing:-.09em; pointer-events:none; user-select:none; }
.services-details { background:#0d0d0c; }
.services-details::before { content:""; position:absolute; z-index:-1; inset:0 0 0 auto; width:34%; background:#191918; clip-path:polygon(34% 0,100% 0,100% 100%,0 100%); opacity:.82; }
.services-details::after { content:""; position:absolute; z-index:-1; right:9%; bottom:8%; width:clamp(170px,24vw,380px); aspect-ratio:1; border:1px solid rgba(217,169,40,.18); border-radius:50%; box-shadow:0 0 0 34px rgba(217,169,40,.025),0 0 0 68px rgba(217,169,40,.018); }
.details-heading { display:grid; grid-template-columns:minmax(260px,1fr) minmax(360px,1.4fr); gap:clamp(40px,8vw,120px); align-items:end; }
.details-heading .eyebrow { grid-column:1 / -1; margin-bottom:0; }
.details-heading h2,.practical-intro h2,.quality-section h2 { margin:0; font-size:clamp(3rem,6vw,7rem); font-weight:750; line-height:.94; letter-spacing:-.055em; text-wrap:balance; }
.details-heading > p:last-child { margin:0; max-width:520px; color:#b9b9b3; font-size:1.05rem; line-height:1.7; }
.services-list { position:relative; margin-top:clamp(80px,11vw,150px); border-top:1px solid rgba(255,255,255,.18); }
.service-row { display:grid; grid-template-columns:60px minmax(240px,.9fr) minmax(300px,1.1fr); gap:clamp(22px,5vw,80px); align-items:center; padding:32px 0; border-bottom:1px solid rgba(255,255,255,.18); transition:padding 320ms ease,background 320ms ease; }
.service-row:hover { padding-left:20px; padding-right:20px; background:rgba(217,169,40,.075); }
.service-row > span { color:var(--mustard); font-size:.64rem; font-weight:800; letter-spacing:.14em; }
.service-row h3 { margin:0; font-size:clamp(1.35rem,2.2vw,2.2rem); font-weight:700; letter-spacing:-.035em; }
.service-row p { margin:0; color:#b9b9b3; font-size:.95rem; line-height:1.65; }
.practical-details { display:grid; grid-template-columns:minmax(300px,.9fr) minmax(440px,1.1fr); gap:clamp(60px,10vw,160px); align-items:center; background:#f4f4f0; color:#151510; }
.practical-details::before { content:""; position:absolute; z-index:-1; width:clamp(300px,52vw,820px); aspect-ratio:1; top:-38%; left:-16%; border:1px solid rgba(20,20,15,.16); border-radius:50%; box-shadow:0 0 0 64px rgba(20,20,15,.025),0 0 0 128px rgba(20,20,15,.018); }
.practical-details .post-section-number { color:rgba(20,20,15,.055); }
.practical-intro .eyebrow { margin-bottom:28px; }
.practical-details .eyebrow { color:#292516; }
.practical-columns { display:grid; grid-template-columns:1fr 1fr; gap:clamp(36px,5vw,72px); }
.practical-block { position:relative; }
.detail-label { display:block; padding-bottom:18px; border-bottom:2px solid #171711; color:#171711; font-size:.66rem; font-weight:850; letter-spacing:.2em; text-transform:uppercase; }
.practical-block dl { margin:0; }
.practical-block dl div { padding:20px 0; border-bottom:1px solid rgba(20,20,15,.25); }
.practical-block dt { color:rgba(20,20,15,.64); font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.practical-block dd { margin:8px 0 0; font-size:1.08rem; font-weight:700; }
.payment-list { list-style:none; margin:0; padding:0; }
.payment-list li { position:relative; padding:20px 28px 20px 0; border-bottom:1px solid rgba(20,20,15,.25); font-size:1.08rem; font-weight:700; transition:padding 220ms ease; }
.payment-list li::after { content:"↗"; position:absolute; right:2px; color:rgba(20,20,15,.5); transition:transform 220ms ease,color 220ms ease; }
.payment-list li:hover { padding-left:8px; }
.payment-list li:hover::after { color:#171711; transform:translate(3px,-3px); }
.quality-section { min-height:100vh; padding:clamp(120px,14vw,210px) clamp(24px,10vw,170px); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; background:#d3d3ce; color:#11110f; }
.quality-section .post-section-number { color:rgba(20,20,15,.06); }
.quality-section::before,.quality-section::after { content:""; position:absolute; z-index:-1; border:1px solid rgba(20,20,15,.14); border-radius:50%; pointer-events:none; }
.quality-section::before { width:clamp(300px,48vw,760px); aspect-ratio:1; left:-21%; top:-24%; box-shadow:0 0 0 54px rgba(20,20,15,.018); }
.quality-section::after { width:clamp(220px,32vw,500px); aspect-ratio:1; right:-12%; bottom:-28%; box-shadow:0 0 0 42px rgba(20,20,15,.015); }
.quality-inner { display:flex; flex-direction:column; align-items:center; }
.quality-section h2 { max-width:950px; }
.quality-copy { max-width:700px; margin:35px auto 0; color:#50504b; font-size:clamp(1rem,1.4vw,1.2rem); line-height:1.75; }
.quality-actions { margin-top:40px; display:flex; align-items:center; gap:18px; }
.quality-section .support-badge { border-color:rgba(20,20,15,.22); color:#343430; }
.site-header.post-light { color:#151510; border-bottom-color:rgba(20,20,15,.16); }
.site-header.post-light nav { color:#4e4e49; }

[data-post-reveal].post-reveal { animation:postReveal .78s cubic-bezier(.22,.7,.18,1) both; animation-delay:var(--reveal-delay,0ms); }
@keyframes postReveal { from { opacity:0; transform:translateY(34px); } to { opacity:1; transform:translateY(0); } }

@media (max-width:720px) {
  .site-header { height:70px; padding:0 20px; grid-template-columns:1fr auto; }
  nav { display:none; }
  .header-action { font-size:.64rem; }
  .service-section { min-height:100svh; padding:108px 24px 70px; }
  .section-content,.align-left .section-content,.align-right .section-content,.align-center .section-content { width:100%; justify-self:start; text-align:left; }
  h1 { font-size:clamp(3.15rem,15vw,5.2rem); line-height:.92; }
  .description,.align-center .description,.align-right .description,.section-actions,.align-center .section-actions,.align-right .section-actions { margin-left:0; margin-right:0; }
  .section-actions { align-items:flex-start; flex-direction:column; }
  .section-index { top:auto; left:auto; right:24px; bottom:26px; flex-direction:row; transform:none; }
  .section-index i { width:44px; height:1px; background:linear-gradient(90deg,var(--mustard) 16%,var(--line) 16%); }
  .section-note { display:none; }
  .details-section { padding:110px 24px 90px; }
  .post-section-number { top:92px; right:18px; font-size:8.5rem; }
  .services-details::before { width:62%; opacity:.5; }
  .services-details::after { right:-26%; bottom:10%; }
  .details-heading,.practical-details { grid-template-columns:1fr; gap:42px; }
  .details-heading .eyebrow { grid-column:auto; }
  .details-heading h2,.practical-intro h2,.quality-section h2 { font-size:clamp(2.8rem,13vw,4.6rem); }
  .services-list { margin-top:70px; }
  .service-row { grid-template-columns:34px 1fr; gap:12px 16px; padding:26px 0; }
  .service-row:hover { padding-left:10px; padding-right:10px; }
  .service-row p { grid-column:2; }
  .practical-columns { grid-template-columns:1fr; gap:48px; }
  .quality-section { min-height:100svh; padding:110px 24px 90px; align-items:flex-start; text-align:left; }
  .quality-inner { align-items:flex-start; }
  .quality-copy { margin-left:0; }
  .quality-actions { align-items:flex-start; flex-direction:column; }
}

@media (max-width:390px) {
  .brand { letter-spacing:.13em; }
  .header-action { gap:6px; letter-spacing:.08em; }
  h1 { font-size:3rem; }
  .description { margin-top:25px; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none !important; animation:none !important; } }
