/* Shared styles for the inner content pages (products, faq, share-recovery).
   Colours and type match index.html. */
:root{
  --green:#0B3B2E; --green-soft:#10493A; --ivory:#F7F3EA; --paper:#FFFFFF;
  --gold:#C0A45E; --gold-deep:#A98C43; --ink:#22302B; --muted:#5C6B65; --line:#E8E2D2;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:'Inter',system-ui,sans-serif;color:var(--ink);background:var(--ivory);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Fraunces',Georgia,serif;font-weight:600;line-height:1.15}
img{max-width:100%}
.wrap{max-width:680px;margin:0 auto;padding:0 20px}
a{color:var(--green)}

/* header */
header{position:sticky;top:0;z-index:10;background:rgba(11,59,46,.97);backdrop-filter:blur(6px)}
.bar{display:flex;align-items:center;gap:12px;padding:12px 0}
.bar img{width:44px;height:44px;display:block}
.bar .name{color:var(--ivory);font-family:'Fraunces',serif;font-size:.98rem;letter-spacing:.02em;line-height:1.2;text-decoration:none}
.bar .name small{display:block;color:var(--gold);font-family:'Inter';font-size:.62rem;letter-spacing:.22em;text-transform:uppercase;margin-top:5px}
.bar .login{margin-left:auto}

/* buttons */
.btn{display:inline-block;padding:11px 20px;border-radius:999px;font-weight:600;font-size:.9rem;text-decoration:none;transition:transform .15s ease}
.btn:active{transform:scale(.98)}
.btn-gold{background:linear-gradient(135deg,#D9BC7A,#B8964A);color:#153126;box-shadow:0 2px 12px rgba(184,150,74,.35)}
.btn-ghost{border:1px solid rgba(247,243,234,.4);color:var(--ivory)}
.btn-wa{background:#1FA855;color:#fff;box-shadow:0 2px 12px rgba(31,168,85,.3)}
.btn-wa svg{vertical-align:-3px;margin-right:8px}

/* page hero */
.hero{background:radial-gradient(120% 90% at 80% 0%,var(--green-soft) 0%,var(--green) 55%);color:var(--ivory);padding:48px 0 44px}
.eyebrow{color:var(--gold);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;margin-bottom:16px}
.hero h1{font-size:clamp(1.75rem,6.5vw,2.4rem);margin-bottom:14px}
.hero p{color:#D8DDD4;font-size:1rem;max-width:44ch}
.rule{width:56px;height:2px;background:var(--gold);margin:0 0 18px}

/* jump links */
.jump{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.jump a{font-size:.78rem;color:var(--ivory);text-decoration:none;border:1px solid rgba(247,243,234,.3);border-radius:999px;padding:5px 12px}
.jump a:hover{border-color:var(--gold)}

/* sections */
section{padding:48px 0 8px;scroll-margin-top:80px}
.kicker{color:var(--gold-deep);font-size:.68rem;letter-spacing:.24em;text-transform:uppercase;margin-bottom:10px}
section h2{font-size:1.5rem;margin-bottom:10px;color:var(--green)}
.lead{color:var(--muted);font-size:.94rem;margin-bottom:22px;max-width:56ch}
.prose p{font-size:.95rem;margin-bottom:14px}

/* product cards */
.cards{display:grid;gap:12px}
@media(min-width:600px){ .cards{grid-template-columns:1fr 1fr} }
.card{background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 1px 4px rgba(34,48,43,.05)}
.card h3{font-size:1.06rem;color:var(--green);margin-bottom:6px}
.card p{color:var(--muted);font-size:.88rem}
.card ul{list-style:none;margin-top:10px}
.card li{font-size:.85rem;color:var(--ink);padding:5px 0 5px 16px;position:relative;border-top:1px solid #F0EBDF}
.card li::before{content:"";position:absolute;left:2px;top:13px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.card .tag{display:inline-block;font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-deep);background:#F7F1E2;border-radius:999px;padding:3px 10px;margin-top:12px}
.card.wide{grid-column:1/-1}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chips span{font-size:.78rem;background:#F4F0E6;border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--green)}

/* points list (share recovery) */
.points{display:grid;gap:12px;list-style:none}
.points li{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:16px 18px;font-size:.92rem;color:var(--muted)}
.points li strong{display:block;color:var(--green);font-family:'Fraunces',serif;font-size:1.02rem;font-weight:600;margin-bottom:4px}

.steps{display:grid}
.step{display:flex;gap:16px;padding:16px 0;border-bottom:1px solid #E4DCC8}
.step:last-child{border-bottom:none}
.step .dot{flex:none;width:34px;height:34px;border-radius:50%;background:var(--green);color:var(--gold);display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-size:.9rem}
.step h3{font-size:1.02rem;color:var(--green);margin-bottom:2px}
.step p{color:var(--muted);font-size:.9rem}
.note{font-size:.88rem;color:var(--muted);border-left:3px solid var(--gold);padding:4px 0 4px 14px;margin-top:18px}

/* FAQ accordions */
.faq{display:grid;gap:10px}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:12px}
.faq summary{cursor:pointer;list-style:none;padding:16px 46px 16px 18px;font-weight:600;font-size:.95rem;color:var(--green);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:18px;top:12px;font-size:1.3rem;font-weight:400;color:var(--gold-deep)}
.faq details[open] summary::after{content:"–"}
.faq .a{padding:0 18px 18px;font-size:.9rem;color:var(--ink)}
.faq .a p{margin-bottom:10px}
.faq .a p:last-child{margin-bottom:0}
.faq .a ul{padding-left:18px;margin:6px 0 10px}
.faq .a li{margin-bottom:4px}

/* contact block (share recovery) */
.contact{background:var(--green);color:var(--ivory);border-radius:20px 20px 0 0;margin-top:56px;padding:56px 0}
.contact h2{color:var(--ivory);margin-bottom:26px}
.contact .kicker{color:var(--gold)}
address{font-style:normal;color:#D8DDD4;font-size:.95rem;line-height:1.75;margin-bottom:24px}
address strong{color:var(--ivory)}
.tel{color:var(--gold);text-decoration:none}
.contact .cta{display:grid;gap:12px;max-width:340px}
.contact .btn{text-align:center}
.callback{margin-bottom:24px}
.callback label{display:block;font-family:'Fraunces',serif;font-size:1.05rem;color:var(--ivory);margin-bottom:12px}
.callback .row{display:flex;flex-wrap:wrap;gap:10px;max-width:420px}
.callback input[type=tel]{flex:1 1 180px;padding:12px 16px;border-radius:999px;border:1px solid rgba(247,243,234,.35);background:rgba(247,243,234,.08);color:var(--ivory);font-size:.95rem;outline:none}
.callback input[type=tel]::placeholder{color:#9AABA2}
.callback input[type=tel]:focus{border-color:var(--gold)}
.callback .btn{border:none;cursor:pointer;font-family:inherit}
.cbmsg{font-size:.85rem;color:var(--gold);margin-top:10px;min-height:1.2em}

footer{background:var(--green);color:#9AABA2;font-size:.72rem;padding:30px 0 42px;line-height:1.7}
footer .arn{color:var(--gold);letter-spacing:.06em}
footer a{color:var(--gold);text-decoration:none}
