/* JIGSAW TAILS — OFFICIAL LOCKED BRAND PALETTE */
:root{
  --brand-forest: #29463A;
  --brand-ink:    #21372F;
  --brand-cream:  #F8F0E4;
  --brand-taupe:  #846F59;
}

:root{
  --ink:#21372f;
  --forest:#29463a;
  --forest-dark:#18382d;
  --cream:#f6eee2;
  --paper:#fffdf8;
  --clay:#a66e4f;
  --sand:#d8c1a1;
  --muted:#68746e;
  --line:#dfd7ca;
  /* JIGSAW TAILS — OFFICIAL LOCKED TYPOGRAPHY */
  --font-heading:Georgia,"Times New Roman",serif;
  --font-body:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--font-body);
}
a{color:inherit}
.site-header{
  height:84px;
  padding:12px clamp(20px,6vw,92px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #eee8de;
  position:sticky;
  top:0;
  z-index:30;
  background:rgba(255,253,248,.94);
  backdrop-filter:blur(12px);
}
.brand img{max-height:60px;width:auto;max-width:min(275px,54vw);display:block}
nav{display:flex;gap:26px}
nav a{font-size:14px;color:var(--muted);text-decoration:none}

.hero{
  min-height:700px;
  padding:78px clamp(20px,6vw,92px);
  display:grid;
  grid-template-columns:1fr .9fr;
  gap:72px;
  align-items:center;
  background:
    radial-gradient(circle at 84% 19%,#eedabc 0,transparent 34%),
    linear-gradient(135deg,#fffdf8,#f4eadb);
}
.hero-copy{max-width:730px}
.eyebrow{
  text-transform:uppercase;
  letter-spacing:.18em;
  font-size:12px;
  font-weight:800;
  color:var(--clay);
}
h1,h2{
  font-family:var(--font-heading);
  font-weight:500;
  letter-spacing:-.04em;
}
h1{
  font-size:clamp(58px,7vw,102px);
  line-height:.91;
  margin:.24em 0;
}
h1 em{color:var(--forest);font-weight:400}
h2{
  font-size:clamp(38px,4vw,64px);
  line-height:1;
  margin:.28em 0 .65em;
}
.hero p,.section-intro p{
  color:#526059;
  font-size:18px;
  line-height:1.68;
  max-width:670px;
}
.hero-actions{
  display:flex;
  gap:20px;
  align-items:center;
  flex-wrap:wrap;
  margin:32px 0 22px;
}
.button{
  border:0;
  border-radius:999px;
  padding:15px 24px;
  font:inherit;
  font-weight:760;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:.18s ease;
}
.button:hover{transform:translateY(-1px)}
.primary{background:var(--forest);color:#fff}
.primary:hover{background:var(--forest-dark)}
.secondary{
  background:transparent;
  color:var(--forest);
  border:1px solid var(--forest);
}
.full{width:100%;border-radius:14px;padding:17px 24px}
.trust-row{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  color:var(--muted);
  font-size:12px;
}

.hero-visual{position:relative}
.world-art{
  aspect-ratio:70/51;
  border-radius:28px;
  overflow:hidden;
  position:relative;
  border:8px solid white;
  box-shadow:0 28px 70px rgba(61,52,40,.18);
}
.world-art img{
  width:100%;height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
}
.floating-note{
  display:none;
}
.floating-note span{font-size:12px;color:var(--muted)}

.section{padding:98px clamp(20px,6vw,92px)}
.steps{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:22px;
  margin-top:42px;
}
.steps article{border-top:1px solid var(--line);padding-top:18px}
.steps b{font:30px Georgia,serif;color:var(--sand)}
.steps h3{margin:27px 0 8px}
.steps p{line-height:1.6;color:var(--muted)}

/* ── Finished puzzle / physical product preview ─────────────────────────── */
.product-preview-section{
  background:var(--cream);
}
.product-preview-layout{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);
  gap:clamp(40px,7vw,100px);
  align-items:center;
}
.product-preview-figure{
  margin:0;
  text-align:center;
}
.product-preview-figure img{
  display:block;
  width:100%;
  height:auto;
  max-width:620px;
  margin:0 auto;
}
.product-preview-figure figcaption{
  margin:16px auto 0;
  max-width:480px;
  color:var(--muted);
  font-size:.8rem;
  line-height:1.5;
}
.product-preview-copy h2{
  max-width:620px;
}
.product-preview-copy p{
  max-width:590px;
  color:#526059;
  font-size:18px;
  line-height:1.68;
}
.product-preview-detail{
  margin-top:24px;
  color:var(--forest) !important;
  font-size:14px !important;
  font-weight:750;
}

/* ── Creation view back navigation ───────────────────────────────────────── */
.creation-back-nav{
  padding:24px clamp(20px,6vw,92px) 0;
}
.back-btn{
  background:none;
  border:none;
  cursor:pointer;
  font-size:14px;
  font-weight:600;
  color:var(--forest);
  padding:0;
  display:inline-flex;
  align-items:center;
  gap:6px;
  letter-spacing:.01em;
}
.back-btn:hover{opacity:.65}

/* ── World-art label ("Their Jigsaw Tail") ────────────────────────────────── */
.world-art-label{
  position:absolute;
  bottom:12px;
  left:14px;
  font-size:10px;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:white;
  background:rgba(0,0,0,.46);
  padding:4px 10px;
  border-radius:20px;
  pointer-events:none;
}

/* ── Bottom CTA section ───────────────────────────────────────────────────── */
.bottom-cta-section{
  text-align:center;
  background:var(--cream);
}
.bottom-cta-section h2{margin-bottom:28px}

.examples-section{padding-top:24px}
.examples-intro{
  font-family:var(--font-heading);
  font-size:clamp(20px,2.4vw,28px);
  color:var(--ink);
  text-align:center;
  margin:0 0 16px;
}
.examples-sub{
  text-align:center;
  color:var(--muted);
  max-width:560px;
  margin:0 auto 48px;
  line-height:1.6;
}
.examples-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
}
@media(max-width:700px){
  .examples-grid{grid-template-columns:1fr}
}

.create-section{background:var(--cream)}
.section-intro{max-width:850px;margin-bottom:40px}
.creator-grid{
  display:grid;
  grid-template-columns:.86fr 1.14fr;
  gap:30px;
  align-items:start;
}
.panel{
  background:var(--paper);
  border:1px solid rgba(33,55,47,.1);
  border-radius:24px;
  padding:28px;
}
.form-panel{display:grid;gap:17px}
.upload-zone{
  border:1.5px dashed #b5ad9f;
  border-radius:18px;
  padding:28px;
  text-align:center;
  display:grid;
  gap:6px;
  cursor:pointer;
}
.upload-zone input{position:absolute;opacity:0;pointer-events:none}
.plus{
  width:42px;height:42px;border-radius:50%;
  margin:auto;
  background:var(--forest);color:#fff;
  display:grid;place-items:center;
  font-size:24px;
}
.upload-zone small,.small-note{font-size:12px;color:var(--muted)}
.photo-preview{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.photo-thumb{position:relative}
.photo-thumb img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:11px;display:block}
.photo-remove{position:absolute;top:4px;right:4px;width:22px;height:22px;border-radius:50%;border:none;background:rgba(0,0,0,.55);color:#fff;font-size:14px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:background .15s}
.photo-remove:hover{background:rgba(0,0,0,.8)}
.two-col{display:grid;grid-template-columns:1fr 1fr;gap:13px}
.form-intro{font-size:14px;color:var(--muted);margin:0 0 20px;line-height:1.5}
label>span{display:block;font-size:13px;font-weight:750;margin-bottom:5px}
label>span .opt{font-weight:400;font-style:normal;color:var(--muted);font-size:11px;margin-left:5px;text-transform:uppercase;letter-spacing:.04em}
small.helper{display:block;font-size:12px;color:var(--muted);line-height:1.45;margin-bottom:8px}
small.helper--disclaimer{font-size:11px;opacity:0.65;margin-top:6px;margin-bottom:0;font-style:italic}
.examples-section .floating-note{display:flex;position:absolute;right:-18px;bottom:-26px;padding:15px 19px;border-radius:15px;background:white;box-shadow:0 14px 34px rgba(55,47,38,.16);flex-direction:column;gap:3px}
.field-group{display:flex;flex-direction:column;gap:0}
.surprise-row{
  display:flex;align-items:center;gap:8px;
  margin-top:8px;
  font-size:12px;color:var(--muted);cursor:pointer;
}
.surprise-row input{width:auto;margin:0;border-radius:4px;padding:0}
input,textarea{
  width:100%;
  border:1px solid #d8d0c4;
  border-radius:12px;
  background:#fff;
  color:var(--ink);
  padding:13px 14px;
  font:inherit;
}
textarea{min-height:84px;resize:vertical}
input:focus,textarea:focus{outline:3px solid rgba(41,70,58,.08);border-color:var(--forest)}
.consent-row{display:flex;gap:10px;align-items:flex-start;color:var(--muted);font-size:12px}
.consent-row input{width:auto;margin-top:2px}

.example-reference{margin-top:14px;display:flex;flex-direction:column;align-items:flex-start}
.example-reference-label{display:block;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.example-reference img{width:200px;height:260px;border-radius:14px;display:block;object-fit:cover;object-position:center top}

.result-panel{min-height:620px}
.state{
  min-height:560px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  text-align:center;
  padding:45px;
  color:var(--muted);
}
.paw-icon{font-size:66px;filter:grayscale(1);opacity:.5}
/* ── Loading experience ─────────────────────────────────────────────────── */
.loading-state{
  align-items:stretch !important;   /* override .state centering so stages span full width */
  text-align:center;
}
.loading-title{
  font-family:var(--font-heading);
  font-size:1.1rem;font-weight:500;
  color:var(--ink);margin:0 0 8px;
}
.loading-subtitle{
  font-size:13px;color:var(--muted);
  margin:0 0 26px;line-height:1.6;
}

/* Stage track */
.loading-stages{
  position:relative;
  margin:0 0 26px;
  width:100%;
}
.stage-track-rail{
  position:absolute;
  top:7px;             /* vertically centred behind the 14px dots */
  left:10%;right:10%;
  height:2px;
  background:var(--line);
  border-radius:1px;
}
.stage-track-fill{
  height:100%;
  background:var(--forest);
  border-radius:1px;
  width:0%;
  transition:width 1.2s ease;
}
.stage-dots{
  display:flex;
  justify-content:space-between;
  position:relative;z-index:1;
}
.stage-point{
  display:flex;flex-direction:column;
  align-items:center;gap:5px;flex:1;
}
.stage-dot{
  width:14px;height:14px;border-radius:50%;
  border:2px solid var(--line);
  background:var(--paper);
  transition:background .4s,border-color .4s;
  flex-shrink:0;
}
.stage-point.complete .stage-dot{
  background:var(--forest);border-color:var(--forest);
}
.stage-point.active .stage-dot{
  background:var(--forest);border-color:var(--forest);
  animation:stagePulse 1.8s ease-in-out infinite;
}
.stage-label{
  font-size:9.5px;color:var(--muted);
  text-align:center;line-height:1.3;
  white-space:nowrap;
  transition:color .4s;
}
.stage-point.active  .stage-label,
.stage-point.complete .stage-label{color:var(--forest)}
@keyframes stagePulse{
  0%,100%{box-shadow:0 0 0 0 rgba(41,70,58,.35)}
  50%    {box-shadow:0 0 0 6px rgba(41,70,58,0)}
}

/* Rotating creation message */
.loading-message-wrap{
  min-height:70px;
  display:flex;flex-direction:column;
  align-items:center;gap:7px;
}
.loading-msg-title{
  font-family:var(--font-heading);
  font-size:.97rem;font-weight:500;
  color:var(--ink);margin:0;
  transition:opacity .3s ease;
}
.loading-msg-body{
  font-size:13px;color:var(--muted);
  line-height:1.6;margin:0;
  transition:opacity .3s ease;
}
.loading-msg-title.fading,
.loading-msg-body.fading{opacity:0}

/* Reveal state */
.loading-reveal{
  animation:revealFadeIn .45s ease;
  min-height:70px;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:6px;
}
.reveal-ready{
  font-family:var(--font-heading);
  font-size:1.1rem;font-weight:500;
  color:var(--forest);margin:0;
}
.reveal-ready em{font-style:normal}
.reveal-sub{font-size:13px;color:var(--muted);margin:0}
@keyframes revealFadeIn{
  from{opacity:0;transform:translateY(7px)}
  to  {opacity:1;transform:translateY(0)}
}

/* Error state */
.loading-error{
  min-height:70px;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  gap:10px;
}
.loading-error-heading{
  font-family:var(--font-heading);
  font-size:.97rem;font-weight:500;
  color:var(--ink);margin:0;
}
.loading-error-body{
  font-size:13px;color:var(--muted);
  line-height:1.6;margin:0;
}
/* Admin / test controls — only visible when ENABLE_TEST_CONTROLS=true */
.admin-panel{
  position:fixed;
  bottom:12px;right:16px;
  z-index:300;
  display:flex;
  align-items:center;
  gap:12px;
  background:rgba(30,30,30,.92);
  color:#ccc;
  border-radius:12px;
  padding:10px 14px;
  font-size:12px;
  backdrop-filter:blur(8px);
  box-shadow:0 4px 20px rgba(0,0,0,.35);
  flex-wrap:wrap;
}
.admin-label{font-weight:700;letter-spacing:.04em;white-space:nowrap;color:#fff}

/* ── Engine selector block — vertical stack so label/select/status are unambiguous ── */
.admin-engine-block{
  display:flex;
  flex-direction:column;
  gap:5px;
  border-left:1px solid rgba(255,255,255,.18);
  border-right:1px solid rgba(255,255,255,.18);
  padding:0 14px;
}
.admin-engine-block-label{
  font-size:10px;
  font-weight:700;
  color:rgba(255,255,255,.5);
  text-transform:uppercase;
  letter-spacing:.07em;
  white-space:nowrap;
  cursor:default;
}
.admin-engine-select{
  background:rgba(255,255,255,.14);
  color:#fff;
  border:1px solid rgba(255,255,255,.28);
  border-radius:7px;
  padding:6px 10px;
  font:inherit;
  font-size:12px;
  cursor:pointer;
  white-space:nowrap;
  min-width:220px;
}
.admin-engine-select:focus{outline:2px solid rgba(255,200,60,.7)}
.admin-engine-select.admin-engine-override{
  border-color:rgba(255,180,40,.8);
  background:rgba(255,140,0,.28);
  color:#ffd97a;
  font-weight:600;
}
/* Live "Will submit:" status — sits directly under the select */
.admin-engine-status{
  font-size:11px;
  padding:3px 8px;
  border-radius:5px;
  white-space:nowrap;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);
  color:#aaa;
}
.admin-engine-status[data-mode="test"]{
  background:rgba(255,140,0,.24);
  border-color:rgba(255,180,40,.6);
  color:#ffd97a;
  font-weight:600;
}
.admin-export-btn{
  background:rgba(40,110,200,.85);
  color:#fff;
  border:none;
  border-radius:6px;
  padding:5px 10px;
  font:inherit;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.admin-export-btn:hover{background:rgba(40,110,200,1)}
.admin-reset-btn{
  background:rgba(220,80,60,.85);
  color:#fff;
  border:none;
  border-radius:6px;
  padding:5px 10px;
  font:inherit;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.admin-reset-btn:hover{background:rgba(220,80,60,1)}

/* Load-order block — TEMPORARY test utility */
.admin-load-block{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}
.admin-load-row{
  display:flex;
  gap:4px;
  align-items:center;
  flex-wrap:wrap;
}
.admin-load-input{
  background:rgba(255,255,255,.12);
  border:1px solid rgba(255,255,255,.25);
  border-radius:5px;
  color:#fff;
  font:inherit;
  font-size:11px;
  padding:4px 7px;
  min-width:0;
  width:220px;
  outline:none;
}
.admin-load-input::placeholder{color:rgba(255,255,255,.45)}
.admin-load-input:focus{border-color:rgba(255,255,255,.6)}
.admin-load-pet{width:110px}
.admin-load-btn{
  background:rgba(80,160,80,.85);
  color:#fff;
  border:none;
  border-radius:5px;
  padding:4px 10px;
  font:inherit;
  font-size:11px;
  font-weight:700;
  cursor:pointer;
  white-space:nowrap;
}
.admin-load-btn:hover{background:rgba(80,160,80,1)}

/* Keep browsing block */
.keep-browsing-wrap{
  margin:14px 0 20px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:13px;
}
.keep-browsing-copy{
  font-size:13px;
  color:var(--muted);
  line-height:1.65;
  margin:0;
  max-width:370px;
}
.keep-browsing-btn{
  font-size:13px;
  padding:10px 20px;
}

/* Generation status banner — fixed bottom strip while browsing */
.gen-status-banner{
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:200;
  background:var(--forest);
  color:#fff;
  padding:13px clamp(20px,6vw,92px);
  box-shadow:0 -3px 20px rgba(0,0,0,.16);
  animation:bannerSlideUp .35s ease;
}
.gen-status-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  max-width:1100px;
  margin:0 auto;
}
.gen-status-title{
  font-family:var(--font-heading);
  font-size:.9rem;
  font-weight:500;
  margin:0 0 2px;
}
.gen-status-sub{
  font-size:12px;
  opacity:.72;
  margin:0;
}
.gen-status-btn{
  background:rgba(255,255,255,.13) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.32) !important;
  white-space:nowrap;
  flex-shrink:0;
  font-size:13px;
  padding:10px 18px;
}
.gen-status-btn:hover{
  background:rgba(255,255,255,.24) !important;
}

/* Artwork ready notification */
.artwork-ready-notif{
  position:fixed;
  bottom:0;left:0;right:0;
  z-index:200;
  background:#7a4f34;
  color:#fff;
  padding:13px clamp(20px,6vw,92px);
  box-shadow:0 -3px 24px rgba(0,0,0,.2);
  animation:bannerSlideUp .4s ease;
}
@keyframes bannerSlideUp{
  from{transform:translateY(100%);opacity:0}
  to  {transform:translateY(0);opacity:1}
}
.artwork-ready-inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  max-width:1100px;
  margin:0 auto;
}
.artwork-ready-title{
  font-family:var(--font-heading);
  font-size:.9rem;
  font-weight:500;
  margin:0 0 2px;
}
.artwork-ready-sub{
  font-size:12px;
  opacity:.82;
  margin:0;
}
.artwork-ready-btn{
  background:rgba(255,255,255,.18) !important;
  color:#fff !important;
  border:1px solid rgba(255,255,255,.38) !important;
  white-space:nowrap;
  flex-shrink:0;
  font-size:13px;
  padding:10px 18px;
}
.artwork-ready-btn:hover{
  background:rgba(255,255,255,.3) !important;
}

@media(max-width:600px){
  .gen-status-inner,.artwork-ready-inner{flex-direction:column;align-items:flex-start;gap:10px}
  .gen-status-btn,.artwork-ready-btn{width:100%}
}

.hidden{display:none!important}

.compare-grid{
  display:grid;
  grid-template-columns:.42fr .58fr;
  gap:11px;
  align-items:start;
}
.compare-grid figure{margin:0;position:relative}
/* Reference photo — fixed crop height */
.compare-grid figure:first-child img{
  width:100%;
  height:390px;
  display:block;
  object-fit:cover;
  border-radius:15px;
  background:#eee;
}
/* Generated jigsaw — full scene, no cropping */
.compare-grid figure:last-child img{
  width:100%;
  height:auto;
  display:block;
  object-fit:contain;
  border-radius:15px;
  background:#f5f0e8;
}
.compare-grid figcaption{
  position:absolute;
  top:9px;left:9px;z-index:2;
  border-radius:20px;
  background:rgba(255,255,255,.92);
  padding:6px 9px;
  font-size:10px;
  font-weight:800;
}
.approval-box{
  border-top:1px solid var(--line);
  margin-top:18px;
  padding-top:18px;
}
.approval-box h3{margin:0 0 6px}
.approval-box p{margin:0;color:var(--muted);font-size:13px;line-height:1.5}
.button-row{display:flex;gap:9px;margin-top:18px}
.button-row .button{flex:1}
.regen-note{margin-top:10px !important;font-size:12px !important;color:var(--muted);line-height:1.5}
.watermark-note{margin-top:8px !important;font-size:11.5px !important;color:var(--muted);line-height:1.5;font-style:italic;opacity:.85}
.new-puzzle-row{text-align:right;margin-bottom:12px}
.new-puzzle-btn{background:none;border:none;padding:0;font-size:13px;color:var(--muted);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.new-puzzle-btn:hover{color:var(--primary)}

/* Dual version comparison */
.dual-heading{margin:18px 0 6px;font-size:1.05rem}
.dual-sub{font-size:13px;color:var(--muted);margin:0 0 8px;line-height:1.5}
.versions-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.version-card{
  display:flex;flex-direction:column;gap:10px;
  border:2px solid var(--line);
  border-radius:14px;
  padding:12px;
  transition:border-color .2s,box-shadow .2s;
}
.version-card img{width:100%;border-radius:8px;display:block;object-fit:cover}
.version-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.version-card .button{width:100%;margin-top:auto}
.version-selected{border-color:var(--brand-forest) !important;box-shadow:0 0 0 3px rgba(41,70,58,.15)}
.button-chosen{background:var(--brand-forest) !important;color:#fff !important;border-color:var(--brand-forest) !important}
.order-box{
  margin-top:20px;
  padding:20px;
  border-radius:17px;
  background:#edf3ee;
}
.approved{font-size:12px;color:var(--brand-forest);font-weight:800}
.order-line{
  display:flex;
  justify-content:space-between;
  gap:20px;
  padding:10px 0;
  border-bottom:1px solid rgba(33,55,47,.08);
}
.order-line.muted{
  font-size:12px;color:var(--muted);
  margin-bottom:14px;
}
.print-link{
  display:block;
  text-align:center;
  margin-top:14px;
  font-size:13px;
}

/* ── Meet the puzzles ─────────────────────────────────────────────────────── */
.puzzle-sizes-section .section-lead{
  max-width:600px;
  color:var(--muted);
  line-height:1.65;
  margin:8px 0 52px;
}
.puzzle-cards{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:28px;
}
.puzzle-card{
  background:#fff;
  border:1.5px solid var(--line);
  border-radius:22px;
  padding:36px 32px 32px;
  display:flex;
  flex-direction:column;
  gap:14px;
}
.puzzle-card-header{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
}
.puzzle-card-pieces{
  font-family:var(--font-heading);
  font-size:1.35rem;
  font-weight:400;
  color:var(--ink);
}
.puzzle-card-price{
  font-family:var(--font-heading);
  font-size:1.7rem;
  font-weight:400;
  color:var(--forest);
}
.puzzle-card-sub{
  font-weight:600;
  color:var(--ink);
  margin:0;
  font-size:.95rem;
}
.puzzle-card-desc{
  color:var(--muted);
  line-height:1.6;
  margin:0;
  font-size:.9rem;
  flex:1;
}
.puzzle-card-size{
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.03em;
  color:var(--muted);
  text-transform:uppercase;
  margin:0;
}
.puzzle-card .button{
  margin-top:8px;
  text-align:center;
}
@media(max-width:700px){
  .puzzle-cards{grid-template-columns:1fr}
}

/* ── Pricing section ──────────────────────────────────────────────────────── */
.pricing-section .section-lead{
  max-width:560px;
  color:var(--muted);
  line-height:1.65;
  margin:8px 0 52px;
}
.pricing-layout{
  display:grid;
  grid-template-columns:1fr 1.2fr;
  gap:60px;
  align-items:start;
}
.pricing-price-list{
  display:flex;
  flex-direction:column;
  gap:0;
}
.pricing-row{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:20px;
  padding:14px 0;
  border-bottom:1px solid var(--line);
}
.pricing-row-delivery{
  border-bottom:2px solid var(--line);
}
.pricing-row-label{color:var(--ink);font-size:.95rem}
.pricing-row-amount{
  font-family:var(--font-heading);
  font-size:1.1rem;
  color:var(--forest);
  white-space:nowrap;
}
.pricing-artwork-note{
  margin-top:28px;
  padding:22px 24px;
  background:#f8f6f1;
  border-radius:14px;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.pricing-artwork-note p{margin:0;line-height:1.6;color:var(--ink);font-size:.9rem}
.pricing-artwork-note-sub{color:var(--muted) !important;font-size:.85rem !important}

/* What's included */
.whats-included h3{
  font-family:var(--font-heading);
  font-size:1.2rem;
  color:var(--ink);
  margin:0 0 24px;
  font-weight:400;
}
.included-list{
  list-style:none;
  margin:0;
  padding:0;
  display:flex;
  flex-direction:column;
  gap:0;
}
.included-list li{
  padding:16px 0;
  border-bottom:1px solid var(--line);
  display:flex;
  flex-direction:column;
  gap:4px;
}
.included-list li:last-child{border-bottom:none}
.included-list strong{color:var(--ink);font-size:.9rem}
.included-list span{color:var(--muted);font-size:.85rem;line-height:1.55}

@media(max-width:860px){
  .pricing-layout{grid-template-columns:1fr}
}

/* "See your artwork before you order" reassurance callout */
.artwork-reassurance{
  margin-top:36px;
  padding:24px 28px;
  background:#f8f6f1;
  border-radius:14px;
  text-align:center;
}
.artwork-reassurance-heading{
  font-family:var(--font-heading);
  font-size:1.15rem;
  font-weight:400;
  color:var(--ink);
  margin:0 0 10px;
}
.artwork-reassurance-body{
  margin:0 0 6px;
  font-size:.95rem;
  color:var(--ink);
  line-height:1.6;
}
.artwork-reassurance-sub{
  margin:0;
  font-size:.875rem;
  color:var(--muted);
  line-height:1.55;
}

/* ── Delivery section ─────────────────────────────────────────────────────── */
.delivery-section{background:var(--cream)}
.delivery-section h2{max-width:520px;margin-bottom:24px}
.delivery-body{max-width:540px}
.delivery-body p{line-height:1.7;color:var(--ink);margin:0 0 12px}
.delivery-note{color:var(--muted) !important;font-size:.9rem}

/* ── Puzzle size label (in creation flow) ─────────────────────────────────── */
.puzzle-option-size-label{
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--muted);
  margin:2px 0 0;
}

/* ── Order summary panel ──────────────────────────────────────────────────── */
.order-summary{
  margin-top:14px;
  display:flex;
  flex-direction:column;
}
.order-summary-line{
  display:flex;
  justify-content:space-between;
  align-items:baseline;
  gap:16px;
  padding:9px 0;
  border-bottom:1px solid rgba(33,55,47,.08);
  font-size:.88rem;
  color:var(--ink);
}
.order-summary-line:last-child{border-bottom:none}
.order-summary-amount{
  font-family:var(--font-heading);
  font-size:.95rem;
  white-space:nowrap;
}
.order-credit-amount{color:var(--brand-forest)}
.order-total-line{
  font-weight:700;
  padding-top:12px;
  font-size:.95rem;
}
.order-total-line .order-summary-amount{
  font-size:1.05rem;
  color:var(--forest);
}

/* ── Gift-card section (order panel) ──────────────────────────────────────── */
.gift-card-section{
  margin-top:16px;
  padding-top:14px;
  border-top:1px solid rgba(33,55,47,.08);
}
.gift-card-heading{
  font-size:.85rem;
  font-weight:700;
  color:var(--forest);
  margin:0 0 10px;
  text-transform:none;
  letter-spacing:0;
}
.gift-card-option-row{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.gift-card-photo{
  width:100px;
  height:100px;
  object-fit:cover;
  border-radius:8px;
  flex-shrink:0;
}
.gift-card-option-text{
  flex:1;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.gift-card-checkbox-label{
  display:flex;
  align-items:flex-start;
  gap:8px;
  cursor:pointer;
  font-size:.88rem;
  font-weight:600;
  color:var(--ink);
  line-height:1.4;
}
.gift-card-checkbox{
  width:16px;
  height:16px;
  flex-shrink:0;
  margin-top:2px;
  accent-color:var(--forest);
  cursor:pointer;
}
.gift-card-copy{
  font-size:.82rem;
  color:var(--muted);
  margin:0;
  line-height:1.5;
}
.gift-card-reassurance{
  font-size:.78rem;
  color:var(--forest);
  margin:0;
  font-style:italic;
}
.gift-card-message-wrap{
  margin-top:12px;
}
.gift-card-msg-label{
  display:block;
  font-size:.82rem;
  font-weight:600;
  color:var(--ink);
  margin-bottom:6px;
}
.gift-card-textarea{
  width:100%;
  box-sizing:border-box;
  padding:8px 10px;
  border:1.5px solid var(--line);
  border-radius:8px;
  font-family:var(--font-body);
  font-size:.88rem;
  color:var(--ink);
  background:var(--paper);
  resize:none;
  outline:none;
  transition:border-color .15s;
}
.gift-card-textarea:focus{
  border-color:var(--forest);
}
.gift-card-counter-row{
  margin-top:4px;
  font-size:.78rem;
  color:var(--muted);
  text-align:right;
}
.gift-card-helper{
  font-size:.78rem;
  color:var(--muted);
  margin:4px 0 0;
}
@media(max-width:480px){
  .gift-card-photo{width:80px;height:80px}
}

.standard-section{
  background:var(--forest);
  color:#fff;
  display:grid;
  grid-template-columns:.85fr 1.15fr;
  gap:75px;
}
.standard-section .eyebrow{color:#d9bd97}
.principles{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.principles p{margin:0;line-height:1.6;color:#dbe1de}
.principles strong{color:#fff}


/* ── Delivery section — expanded ──────────────────────────────────────────── */
.delivery-highlight{
  background:#fff;
  border:1.5px solid var(--line);
  border-radius:14px;
  padding:22px 24px;
  margin:18px 0;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.delivery-highlight p{margin:0;line-height:1.55}

/* ── FAQ accordion ────────────────────────────────────────────────────────── */
.faq-section .section-lead{
  max-width:560px;
  color:var(--muted);
  line-height:1.65;
  margin:4px 0 44px;
}
.accordion{
  max-width:800px;
  border-top:1px solid var(--line);
}
.accordion-item{
  border-bottom:1px solid var(--line);
}
.accordion-item summary{
  list-style:none;
}
.accordion-item summary::-webkit-details-marker{display:none}
.accordion-q{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  padding:20px 0;
  cursor:pointer;
  font-size:1rem;
  font-weight:600;
  color:var(--ink);
  line-height:1.4;
  user-select:none;
  -webkit-user-select:none;
}
.accordion-q::after{
  content:'＋';
  flex-shrink:0;
  font-size:1.2rem;
  font-weight:400;
  color:var(--clay);
  transition:transform .2s;
}
.accordion-item[open] .accordion-q::after{
  content:'－';
}
.accordion-a{
  padding:0 0 22px;
  color:var(--ink);
}
.accordion-a p{
  margin:0 0 12px;
  line-height:1.7;
  font-size:.95rem;
}
.accordion-a p:last-child{margin-bottom:0}
.faq-spec-list{
  margin:10px 0 12px 18px;
  padding:0;
  line-height:1.8;
  font-size:.9rem;
  color:var(--ink);
}
.faq-spec-list li{margin:0}
@media(max-width:600px){
  .accordion-q{font-size:.95rem;padding:18px 0}
  .accordion-a p{font-size:.9rem}
}

/* ── About section ────────────────────────────────────────────────────────── */
.about-section{background:var(--cream)}
.about-layout{max-width:680px}
.about-copy h2{margin-bottom:28px}
.about-copy p{
  line-height:1.75;
  color:var(--ink);
  margin:0 0 18px;
  font-size:1.02rem;
}
.about-copy p:last-child{margin-bottom:0}
.about-closing{
  font-family:var(--font-heading);
  font-size:1.05rem !important;
  color:var(--forest) !important;
  margin-top:28px !important;
}

/* ── Returns & Refunds section ────────────────────────────────────────────── */
.returns-section .eyebrow{display:block;margin-bottom:8px}
.returns-layout{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:56px;
  align-items:start;
  margin-top:8px;
}
.returns-copy p,.returns-faulty p{
  line-height:1.7;
  color:var(--ink);
  font-size:.95rem;
  margin:0 0 14px;
}
.returns-copy p:last-child,.returns-faulty p:last-child{margin-bottom:0}
.returns-faulty{
  background:#f8f6f1;
  border-radius:16px;
  padding:28px 28px 24px;
}
.returns-faulty h3{
  font-family:var(--font-heading);
  font-size:1.1rem;
  font-weight:400;
  margin:0 0 16px;
  color:var(--ink);
}
.returns-rights{
  font-weight:600 !important;
  color:var(--forest) !important;
  font-size:.875rem !important;
}
@media(max-width:760px){
  .returns-layout{grid-template-columns:1fr}
}

/* ── Contact section ──────────────────────────────────────────────────────── */
.contact-section{background:var(--cream)}
.contact-section .section-lead{
  max-width:520px;
  color:var(--muted);
  line-height:1.65;
  margin:8px 0 32px;
}
.contact-body{max-width:520px}
.contact-emails{
  display:flex;
  flex-direction:column;
  gap:0;
  border-top:1px solid var(--line);
}
.contact-email-row{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:24px;
  padding:16px 0;
  border-bottom:1px solid var(--line);
}
.contact-email-label{
  font-size:.875rem;
  color:var(--muted);
}
.contact-email-address{
  font-size:.95rem;
  font-weight:600;
  color:var(--forest);
  text-decoration:none;
}
.contact-email-address:hover{text-decoration:underline}
@media(max-width:520px){
  .contact-email-row{flex-direction:column;gap:4px}
}

/* ── Footer ───────────────────────────────────────────────────────────────── */
footer{
  border-top:1px solid var(--line);
  color:var(--muted);
}
.footer-inner{
  display:grid;
  grid-template-columns:1fr 1.6fr;
  gap:60px;
  padding:56px clamp(20px,6vw,92px) 48px;
  align-items:start;
}
.footer-brand img{width:235px;display:block}
.footer-brand p{margin:16px 0 0;line-height:1.6;font-size:.9rem}
.footer-links{
  display:grid;
  grid-template-columns:1fr 1fr 1fr;
  gap:28px;
}
.footer-col-heading{
  font-size:.75rem;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink);
  margin:0 0 14px;
}
.footer-link{
  display:block;
  font-size:.875rem;
  color:var(--muted);
  text-decoration:none;
  margin-bottom:8px;
  line-height:1.4;
}
.footer-link:hover{color:var(--ink)}
.footer-link--placeholder{
  color:var(--line);
  cursor:default;
  font-size:.875rem;
}
.footer-base{
  padding:18px clamp(20px,6vw,92px) 24px;
  border-top:1px solid var(--line);
}
.footer-base p{
  margin:0;
  font-size:.8rem;
  color:var(--muted);
}
@media(max-width:860px){
  .footer-inner{grid-template-columns:1fr}
  .footer-links{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  .footer-links{grid-template-columns:1fr}
}

/* ── Mobile menu button ───────────────────────────────────────────────────── */
.mobile-menu-btn{
  display:none;
  background:none;
  border:none;
  cursor:pointer;
  padding:10px;
  width:44px;
  height:44px;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:5px;
  color:var(--brand-ink);
  flex-shrink:0;
}
.mobile-menu-btn .bar{
  display:block;
  width:22px;
  height:2px;
  background:currentColor;
  border-radius:2px;
  transition:transform .22s ease, opacity .22s ease;
}
.mobile-menu-btn[aria-expanded="true"] .bar:nth-child(1){transform:translateY(7px) rotate(45deg)}
.mobile-menu-btn[aria-expanded="true"] .bar:nth-child(2){opacity:0;transform:scaleX(0)}
.mobile-menu-btn[aria-expanded="true"] .bar:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media(max-width:920px){
  .mobile-menu-btn{display:flex}
  nav{
    display:none;
    position:absolute;
    top:100%;
    left:0;
    right:0;
    background:var(--paper);
    border-bottom:1px solid var(--line);
    box-shadow:0 8px 24px rgba(33,55,47,.09);
    flex-direction:column;
    padding:4px 0 12px;
    z-index:29;
  }
  nav.mobile-open{display:flex}
  nav a{
    font-size:15px;
    color:var(--brand-ink);
    padding:13px clamp(20px,6vw,92px);
    border-bottom:1px solid var(--line);
    text-decoration:none;
  }
  nav a:last-child{border-bottom:none}
  .hero,.creator-grid,.standard-section{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .principles{grid-template-columns:1fr}
  .hero{min-height:0;padding-top:58px}
  .product-preview-layout{grid-template-columns:1fr;gap:26px}
  .product-preview-copy{order:-1}
  .product-preview-copy h2{max-width:720px}
}
/* Pre-generation info panel */
.pregeneration-info{
  background:#f8f6f1;
  border:1px solid var(--line);
  border-radius:12px;
  padding:16px 18px;
  margin-bottom:14px;
}
.pregeneration-info h3{margin:0 0 6px;font-size:.95rem}
.pregeneration-info p{margin:6px 0 0;font-size:13px;color:var(--muted);line-height:1.5}
.pregeneration-sub{font-size:12.5px !important}

/* Artwork selection grid */
.artwork-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin:14px 0;
}
.artwork-card{
  display:flex;flex-direction:column;gap:10px;
  border:2px solid var(--line);
  border-radius:14px;
  padding:12px;
  transition:border-color .2s,box-shadow .2s;
}
.artwork-card-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.artwork-card-img{width:100%;border-radius:8px;display:block;object-fit:contain;background:#f5f0e8}
.artwork-card .button{width:100%;margin-top:auto}
.artwork-card.version-selected{border-color:var(--brand-forest) !important;box-shadow:0 0 0 3px rgba(41,70,58,.15)}

/* "Not quite right?" retry section */
.retry-section{
  border:1px solid var(--line);
  border-radius:12px;
  padding:18px 20px;
  margin:4px 0 16px;
  text-align:center;
}
.retry-heading{margin:0 0 8px;font-size:1rem}
.retry-section p{margin:0 0 10px;font-size:13.5px;color:var(--muted);line-height:1.5}
.retry-credit-note{margin:10px 0 0!important;font-size:12px!important;color:var(--muted);opacity:.8}
.retry-refinement{margin:12px 0 16px;text-align:left}
.retry-refinement-label{display:block;font-size:13px;font-weight:600;color:var(--brand-ink);margin-bottom:6px}
.retry-optional{font-size:11px;font-weight:400;color:var(--muted);margin-left:5px;opacity:.85}
.retry-refinement-textarea{
  display:block;width:100%;box-sizing:border-box;
  min-height:72px;resize:vertical;
  padding:9px 11px;border:1px solid var(--line);border-radius:8px;
  font-family:inherit;font-size:13px;line-height:1.5;color:var(--brand-ink);
  background:#fff;
}
.retry-refinement-textarea:focus{outline:none;border-color:var(--brand-forest)}
.retry-refinement-note{margin:7px 0 0!important;font-size:12px!important;color:var(--muted);opacity:.85}

/* "View larger" cue on artwork card image */
.artwork-img-wrap{position:relative;cursor:pointer;border-radius:8px;overflow:hidden}
.artwork-img-wrap:hover .view-larger-hint{opacity:1}
.view-larger-hint{
  position:absolute;bottom:8px;left:50%;transform:translateX(-50%);
  background:rgba(0,0,0,.55);color:#fff;
  font-size:11px;font-weight:600;letter-spacing:.04em;
  padding:4px 10px;border-radius:20px;
  white-space:nowrap;opacity:0;
  transition:opacity .2s;
  pointer-events:none;
}

/* ── Puzzle size selection ────────────────────────────────────────────── */
.puzzle-selection-panel{
  border:1px solid var(--line);border-radius:14px;
  padding:20px 18px;margin:4px 0 16px;
}
.puzzle-select-heading{margin:0 0 14px;font-size:1.05rem}
.puzzle-artwork-preview{
  display:flex;flex-direction:column;align-items:center;gap:6px;
  margin-bottom:14px;
}
.puzzle-artwork-img{
  width:100%;max-height:180px;border-radius:8px;
  object-fit:contain;background:#f5f0e8;display:block;
}
.puzzle-artwork-label{font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.artwork-credit-notice{
  background:#f0f8f2;border:1px solid #b6dfc3;border-radius:8px;
  padding:9px 12px;margin-bottom:14px;
  font-size:13px;color:var(--brand-forest);line-height:1.4;
}
.puzzle-options{
  display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px;
}
.puzzle-option-card{
  display:flex;flex-direction:column;gap:6px;
  border:2px solid var(--line);border-radius:12px;
  padding:14px 12px;cursor:pointer;
  background:#fff;text-align:left;
  transition:border-color .18s,box-shadow .18s;
}
.puzzle-option-card:hover{border-color:var(--brand-forest)}
.puzzle-option-card.puzzle-option-selected{
  border-color:var(--brand-forest);box-shadow:0 0 0 3px rgba(41,70,58,.15);
}
.puzzle-option-pieces{font-size:1.5rem;font-weight:700;color:var(--ink);line-height:1}
.puzzle-option-unit{font-size:.9rem;font-weight:500;color:var(--muted)}
.puzzle-option-price{font-size:1rem;font-weight:600;color:var(--ink);margin-top:2px}
.puzzle-option-desc{margin:6px 0 0;font-size:12.5px;color:var(--muted);line-height:1.45}

/* Artwork lightbox */
.lightbox{
  position:fixed;inset:0;z-index:9000;
  display:flex;align-items:center;justify-content:center;
}
.lightbox.hidden{display:none}
.lightbox-backdrop{
  position:absolute;inset:0;z-index:0;
  background:rgba(0,0,0,.85);
  cursor:pointer;
}
.lightbox-content{
  position:relative;z-index:1;
  display:flex;flex-direction:column;align-items:center;gap:12px;
  max-width:min(94vw,860px);
  padding:0 56px;
}
.lightbox-img{
  max-width:100%;
  max-height:calc(92vh - 110px);
  border-radius:10px;
  object-fit:contain;
  display:block;
  touch-action:pinch-zoom;
}
.lightbox-label{
  color:rgba(255,255,255,.65);
  font-size:11.5px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;
  margin:0;
}
.lightbox-actions{display:flex;gap:10px;justify-content:center}
.lightbox-close{
  position:absolute;top:16px;right:18px;z-index:9001;
  background:rgba(255,255,255,.14);border:none;
  color:#fff;font-size:20px;line-height:1;
  width:40px;height:40px;border-radius:50%;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .15s;
}
.lightbox-close:hover{background:rgba(255,255,255,.28)}
.lightbox-nav{
  position:absolute;top:50%;transform:translateY(-50%);z-index:9001;
  background:rgba(255,255,255,.12);border:none;
  color:#fff;font-size:40px;line-height:1;
  width:44px;height:64px;border-radius:8px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .15s,opacity .2s;
}
.lightbox-nav:hover{background:rgba(255,255,255,.24)}
.lightbox-prev{left:10px}
.lightbox-next{right:10px}

@media(max-width:600px){
  .site-header{height:70px}
  .start-new-wrap{margin-top:20px}
  .brand img{max-height:46px;width:auto;max-width:min(220px,54vw)}
  .hero{padding:55px 20px 72px}
  .section{padding:70px 20px}
  .steps,.two-col,.compare-grid{grid-template-columns:1fr}
  .compare-grid img{height:300px}
  .result-panel{min-height:0}
  .artwork-grid{grid-template-columns:1fr}
  .puzzle-options{grid-template-columns:1fr}
  .state{min-height:350px}
  .lightbox-content{padding:0 46px}
  .lightbox-nav{width:36px;height:52px;font-size:30px}
  .lightbox-prev{left:4px}
  .lightbox-next{right:4px}
  .trust-row{display:grid}
  .floating-note{right:10px}
}

/* ── Legal pages (privacy.html, terms.html) ───────────────────────────────── */
.legal-page{
  padding:48px clamp(20px,6vw,92px) 80px;
  min-height:70vh;
}
.legal-container{
  max-width:760px;
  margin:0 auto;
}
.legal-container h1{
  font-family:var(--font-heading);
  font-size:clamp(30px,4vw,52px);
  font-weight:500;
  letter-spacing:-.04em;
  line-height:1.08;
  margin:.1em 0 .15em;
}
.legal-meta{
  font-size:.85rem;
  color:var(--muted);
  margin:0 0 2.4em;
}
.legal-section{
  margin-bottom:2.4em;
}
.legal-container h2{
  font-family:var(--font-heading);
  font-size:clamp(18px,2.4vw,26px);
  font-weight:500;
  letter-spacing:-.02em;
  line-height:1.2;
  margin:0 0 .5em;
  padding-bottom:.35em;
  border-bottom:1px solid var(--line);
}
.legal-container h3{
  font-family:inherit;
  font-size:1rem;
  font-weight:700;
  margin:1.4em 0 .3em;
  color:var(--ink);
}
.legal-container p,
.legal-container li{
  font-size:1rem;
  line-height:1.78;
  color:#3d4e47;
  margin:.55em 0;
}
.legal-container ul,
.legal-container ol{
  padding-left:1.5em;
  margin:.5em 0 .8em;
}
.legal-container li{
  margin-bottom:.3em;
}
.legal-container a{
  color:var(--forest);
  text-decoration:underline;
}
.legal-container a:hover{
  color:var(--ink);
}
.legal-container address{
  font-style:normal;
}
@media(max-width:600px){
  .legal-page{padding:32px 20px 64px}
}

/* ── Contact address block ─────────────────────────────────────────────────── */
.contact-address{
  margin-top:28px;
  font-size:.95rem;
  line-height:1.8;
  color:var(--muted);
  font-style:normal;
}
.contact-address strong{
  display:block;
  font-size:1rem;
  font-weight:700;
  color:var(--ink);
  margin-bottom:2px;
}

/* ── Footer legal identity line ───────────────────────────────────────────── */
.footer-base p+p{
  margin-top:4px;
}

/* ─── STAGE C — IDENTITY VERIFICATION PANEL ───────────────────────────────
   Modal overlay shown only when ENABLE_IDENTITY_GATES is active and the
   browser is not yet verified.  Hidden by default; toggled by app.js only.
   All customer state (photos, questionnaire) remains intact while open.
   ───────────────────────────────────────────────────────────────────────── */

.identity-panel{
  position:fixed;
  inset:0;
  z-index:200;
  display:flex;
  align-items:center;
  justify-content:center;
}
.identity-panel.hidden{ display:none }

/* Semi-transparent backdrop */
.identity-panel-backdrop{
  position:absolute;
  inset:0;
  background:rgba(33,55,47,.55);
  backdrop-filter:blur(4px);
}

/* Centred content card */
.identity-panel-inner{
  position:relative;
  background:var(--paper);
  border-radius:16px;
  box-shadow:0 24px 64px rgba(0,0,0,.22);
  padding:40px 36px;
  width:min(460px,92vw);
  max-height:90dvh;
  overflow-y:auto;
}

.identity-heading{
  font-family:var(--font-heading);
  font-size:1.35rem;
  font-weight:700;
  color:var(--ink);
  margin:0 0 12px;
  line-height:1.3;
}

.identity-copy{
  font-size:.95rem;
  color:var(--muted);
  margin:0 0 24px;
  line-height:1.55;
}

.identity-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:16px;
}

.identity-field label{
  font-size:.85rem;
  font-weight:600;
  color:var(--ink);
}

.identity-field input{
  padding:12px 14px;
  border:1.5px solid var(--line);
  border-radius:8px;
  font-size:1rem;
  font-family:var(--font-body);
  background:var(--paper);
  color:var(--ink);
  transition:border-color .15s;
  width:100%;
}

.identity-field input:focus{
  outline:none;
  border-color:var(--forest);
  box-shadow:0 0 0 3px rgba(41,70,58,.12);
}

/* 6-digit code input — larger, centred */
#identityCodeInput{
  font-size:1.5rem;
  letter-spacing:.3em;
  text-align:center;
  padding:14px 12px;
}

.identity-error{
  font-size:.85rem;
  color:#c0392b;
  margin:-8px 0 12px;
  min-height:1.1em;
  line-height:1.3;
}

/* Stack the buttons with a small gap */
#identityStepEmail .button,
#identityStepCode  .button{
  margin-top:8px;
  display:block;
  width:100%;
}

#identityStepCode .button+.button{
  margin-top:10px;
}

/* Resend — less prominent */
#identityResendBtn{
  font-size:.88rem;
}

/* Turnstile widget — normally invisible (interaction-only mode) */
.turnstile-widget{
  margin-top:12px;
}

/* Screen-reader-only utility */
.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(max-width:480px){
  .identity-panel-inner{ padding:28px 20px }
  .identity-heading{ font-size:1.15rem }
}