:root{
  --bg:#fffaf5;
  --glass:rgba(255,255,255,.58);
  --glass-strong:rgba(255,255,255,.76);
  --stroke:rgba(255,255,255,.86);
  --brown:#5a3b2b;
  --brown-dark:#2e1f18;
  --cocoa:#9b5f36;
  --green:#8bbf90;
  --mint:#dff4e3;
  --pink:#f4c5d8;
  --gold:#d9aa58;
  --muted:#7c6b62;
  --shadow:0 24px 70px rgba(91,57,36,.12);
  --radius:30px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:Inter,Arial,Helvetica,sans-serif;
  color:var(--brown-dark);
  line-height:1.75;
  background:
    radial-gradient(circle at 12% 12%,rgba(244,197,216,.42),transparent 26%),
    radial-gradient(circle at 86% 18%,rgba(223,244,227,.65),transparent 25%),
    linear-gradient(180deg,#fffdf9,#fff8f2 48%,#fffdf9);
  overflow-x:hidden;
}
body.menu-open{overflow:hidden}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
.container{width:min(1080px,calc(100% - 30px));margin:0 auto}
.glass{
  background:var(--glass);
  border:1px solid var(--stroke);
  box-shadow:var(--shadow);
  backdrop-filter:blur(22px);
  -webkit-backdrop-filter:blur(22px);
}

.ambient{position:fixed;width:340px;height:340px;border-radius:50%;filter:blur(42px);opacity:.32;z-index:-2;animation:glow 10s ease-in-out infinite}
.ambient-one{left:-120px;top:170px;background:var(--pink)}
.ambient-two{right:-110px;top:420px;background:var(--mint);animation-delay:2s}
.ambient-three{left:42%;bottom:-170px;background:#f7ddaa;animation-delay:4s}
@keyframes glow{0%,100%{transform:scale(.82);opacity:.2}50%{transform:scale(1.18);opacity:.46}}

.coconut-field{position:fixed;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.coconut-field span{position:absolute;font-size:42px;opacity:.08;filter:grayscale(.2);animation:float 18s ease-in-out infinite}
.coconut-field span:nth-child(1){left:6%;top:18%}
.coconut-field span:nth-child(2){right:8%;top:28%;animation-delay:2s}
.coconut-field span:nth-child(3){left:16%;bottom:14%;animation-delay:4s}
.coconut-field span:nth-child(4){right:18%;bottom:10%;animation-delay:6s}
.coconut-field span:nth-child(5){left:48%;top:8%;animation-delay:8s}
@keyframes float{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-26px) rotate(8deg)}}

.site-header{position:sticky;top:14px;z-index:30;padding:14px 0}
.header-card{min-height:76px;border-radius:999px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 24px}
.brand{display:inline-flex;align-items:center;gap:12px;font-weight:950;font-size:22px;letter-spacing:-.03em}
.brand img{width:auto;height:44px;max-width:170px;object-fit:contain}
.main-nav{display:flex;gap:22px;font-size:14px;font-weight:850;color:#5b493e}
.main-nav a{padding:9px 0;border-bottom:2px solid transparent}
.main-nav a:hover{color:var(--cocoa);border-bottom-color:var(--cocoa)}
.menu-toggle{display:none;width:44px;height:42px;border:1px solid rgba(91,57,36,.12);border-radius:14px;background:rgba(255,255,255,.72)}
.menu-toggle span{display:block;width:20px;height:2px;background:var(--brown-dark);margin:5px auto}

.hero{padding:54px 0 28px}
.hero-card{border-radius:var(--radius);padding:52px;text-align:center}
.eyebrow{display:inline-flex;margin:0 0 15px;padding:7px 14px;border-radius:999px;background:rgba(155,95,54,.08);color:var(--cocoa);font-size:13px;font-weight:950;text-transform:uppercase;letter-spacing:.06em}
.hero h1{font-size:clamp(42px,6vw,76px);line-height:.98;letter-spacing:-.06em;margin:0 auto 22px;max-width:920px}
.hero p{font-size:20px;color:var(--muted);max-width:760px;margin:0 auto}
.hero-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:28px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 24px;border-radius:999px;font-weight:950;border:1px solid rgba(91,57,36,.16);transition:.22s ease}
.button.primary{background:linear-gradient(135deg,var(--brown),var(--cocoa));color:#fff;box-shadow:0 16px 38px rgba(91,57,36,.2)}
.button.secondary{background:rgba(255,255,255,.72)}
.button:hover{transform:translateY(-3px)}

.single-column{max-width:920px;padding:12px 0 70px}
.banner-slot{margin:0 0 32px;border-radius:26px;overflow:hidden;min-height:230px;background:transparent}
.banner-slot img{width:100%;height:auto;min-height:230px;object-fit:cover;background:transparent}
.inline-banner{margin:42px 0}
.article{border-radius:32px;padding:46px}
.article section{scroll-margin-top:120px}
.article h2{font-size:clamp(29px,3vw,43px);line-height:1.12;letter-spacing:-.04em;margin:54px 0 18px}
.article h2:first-child{margin-top:0}
.article p,.article li{font-size:18px;color:#3b302a}
.article p{margin:0 0 18px}
.article ul{list-style:none;padding:0;margin:18px 0 26px;display:grid;gap:10px}
.article li{position:relative;padding:13px 16px 13px 48px;border-radius:16px;background:rgba(255,255,255,.62);border:1px solid rgba(155,95,54,.12)}
.article li:before{content:"";position:absolute;left:18px;top:18px;width:16px;height:16px;border-radius:50%;border:2px solid var(--cocoa);box-shadow:inset 0 0 0 4px #fff;background:var(--green)}
.table-wrap{overflow-x:auto;margin:28px 0;border-radius:20px;border:1px solid rgba(155,95,54,.14);background:rgba(255,255,255,.72)}
table{width:100%;border-collapse:collapse;min-width:620px}
th,td{padding:17px 19px;text-align:left;border-bottom:1px solid rgba(155,95,54,.12)}
th{background:linear-gradient(135deg,var(--brown),var(--cocoa));color:#fff;text-transform:uppercase;font-size:14px;letter-spacing:.04em}
td{font-size:17px;color:#43362f}
tr:last-child td{border-bottom:0}

.faq{margin-top:48px}
.faq h2{margin-top:0}
.accordion{display:grid;gap:14px}
details{border:1px solid rgba(155,95,54,.14);border-radius:18px;background:rgba(255,255,255,.72);overflow:hidden}
summary{cursor:pointer;list-style:none;padding:20px 54px 20px 22px;font-weight:950;font-size:18px;position:relative}
summary::-webkit-details-marker{display:none}
summary:after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--mint);color:var(--brown);border:1px solid rgba(155,95,54,.12)}
details[open] summary:after{content:"−"}
details p{padding:0 22px 22px;margin:0;color:var(--muted)}

.site-footer{padding:0 0 36px}
.footer-card{border-radius:var(--radius);padding:26px;display:flex;align-items:center;justify-content:space-between;gap:26px}
.footer-brand{flex:0 0 auto}
.footer-card p{max-width:620px;color:var(--muted);margin:0}

@media(max-width:820px){
  .header-card{border-radius:24px;display:grid;grid-template-columns:auto auto;justify-content:space-between;padding:14px 18px}
  .menu-toggle{display:block}
  .main-nav{display:none}
  .main-nav.open{position:fixed;top:102px;left:15px;right:15px;display:grid;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.9);border-radius:20px;padding:14px;box-shadow:var(--shadow);backdrop-filter:blur(18px)}
  .main-nav.open a{padding:12px}
  .hero-card,.article{padding:26px}
  .footer-card{display:grid;justify-items:center;text-align:center}
}

@media(max-width:520px){
  .container{width:min(100% - 20px,1080px)}
  .brand span{display:none}
  .hero h1{font-size:40px}
  .hero p{font-size:18px}
  .banner-slot,.banner-slot img{min-height:180px}
  .article p,.article li{font-size:17px}
}