/*
Theme Name: NeckEase
Theme URI: https://neckease.com
Description: Premium single-product child theme for NeckEase — calm clinical wellness aesthetic.
Author: NeckEase
Template: twentytwentyfive
Version: 1.0.0
Text Domain: neckease
*/

:root{
  --bone:#F6F2EC;
  --bone-2:#EFE8DD;
  --ink:#19211D;
  --muted:#5C635C;
  --spruce:#163A31;
  --spruce-2:#0F2A23;
  --sage:#DCE6DD;
  --clay:#C15B3C;
  --clay-dark:#A94B2F;
  --line:rgba(25,33,29,.12);
  --line-strong:rgba(25,33,29,.18);
  --shadow-soft:0 18px 50px -24px rgba(22,58,49,.45);
  --shadow-card:0 1px 2px rgba(25,33,29,.04), 0 12px 30px -18px rgba(25,33,29,.28);
  --font-display:'Fraunces', Georgia, serif;
  --font-body:'Hanken Grotesk', system-ui, -apple-system, sans-serif;
  --container:1140px;
  --reading:680px;
}

/* ---------- base ---------- */
body.neckease,
.neckease-body{ }
body{
  background:var(--bone);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:18px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  letter-spacing:.002em;
}
a{ color:inherit; }
.ne-display, .ne-hero h1, .ne-sec h2{
  font-family:var(--font-display);
  font-optical-sizing:auto;
  font-weight:560;
  letter-spacing:-.015em;
  line-height:1.06;
}

/* ---------- header ---------- */
.ne-header{
  position:sticky; top:0; z-index:50;
  background:rgba(246,242,236,.82);
  backdrop-filter:saturate(140%) blur(12px);
  -webkit-backdrop-filter:saturate(140%) blur(12px);
  border-bottom:1px solid var(--line);
}
.ne-header .ne-bar{
  max-width:var(--container); margin:0 auto;
  padding:16px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.ne-logo{
  font-family:var(--font-display); font-weight:600; font-size:23px;
  letter-spacing:-.02em; color:var(--spruce); text-decoration:none;
  display:inline-flex; align-items:center; gap:9px;
}
.ne-logo .dot{ width:9px; height:9px; border-radius:50%; background:var(--clay); display:inline-block; }
.ne-nav{ display:flex; align-items:center; gap:30px; }
.ne-nav a.ne-link{
  font-size:15px; font-weight:500; color:var(--ink); text-decoration:none;
  opacity:.78; transition:opacity .2s ease;
}
.ne-nav a.ne-link:hover{ opacity:1; }
.ne-pill{
  font-size:15px; font-weight:600; text-decoration:none;
  background:var(--spruce); color:var(--bone);
  padding:11px 22px; border-radius:999px;
  transition:transform .18s ease, background .2s ease;
}
.ne-pill:hover{ background:var(--spruce-2); transform:translateY(-1px); }
@media(max-width:820px){
  .ne-nav .ne-link{ display:none; }
  .ne-header .ne-bar{ padding:14px 20px; }
}

/* ---------- layout helpers ---------- */
.ne-sec{ padding:96px 28px; }
.ne-sec .ne-inner, .ne-wrap{ max-width:var(--container); margin:0 auto; }
.ne-kicker{
  font-family:var(--font-body); font-size:13px; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase; color:var(--clay);
  margin:0 0 18px;
}
.ne-sec h2{ font-size:clamp(30px,4vw,46px); margin:0 0 18px; color:var(--ink); }
.ne-lead{ color:var(--muted); font-size:20px; max-width:var(--reading); }
.ne-center{ text-align:center; }
.ne-center .ne-lead{ margin-left:auto; margin-right:auto; }

/* ---------- hero ---------- */
.ne-hero{
  position:relative; overflow:hidden;
  padding:84px 28px 96px;
  background:
    radial-gradient(120% 90% at 82% -10%, rgba(193,91,60,.10), transparent 55%),
    radial-gradient(90% 80% at 0% 110%, rgba(22,58,49,.10), transparent 60%),
    var(--bone);
}
.ne-hero .ne-grid{
  max-width:var(--container); margin:0 auto;
  display:grid; grid-template-columns:1.05fr .95fr; gap:56px; align-items:center;
}
.ne-hero h1{ font-size:clamp(38px,5.3vw,66px); margin:0 0 22px; color:var(--ink); }
.ne-hero h1 em{ font-style:italic; color:var(--spruce); }
.ne-hero .ne-sub{ font-size:21px; color:var(--muted); max-width:30em; margin:0 0 30px; }
.ne-price{ display:flex; align-items:baseline; gap:14px; margin:0 0 26px; }
.ne-price .now{ font-family:var(--font-display); font-size:34px; font-weight:600; color:var(--ink); }
.ne-price .was{ font-size:19px; color:var(--muted); text-decoration:line-through; }
.ne-price .ship{ font-size:15px; font-weight:600; color:var(--spruce); }
.ne-actions{ display:flex; align-items:center; gap:16px; flex-wrap:wrap; }
.ne-btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--font-body); font-size:18px; font-weight:600; text-decoration:none;
  padding:17px 34px; border-radius:14px; cursor:pointer;
  transition:transform .18s ease, box-shadow .25s ease, background .2s ease;
}
.ne-btn--primary{ background:var(--clay); color:#fff; box-shadow:0 14px 30px -14px rgba(193,91,60,.7); }
.ne-btn--primary:hover{ background:var(--clay-dark); transform:translateY(-2px); box-shadow:0 20px 38px -16px rgba(193,91,60,.8); }
.ne-btn--ghost{ background:transparent; color:var(--ink); border:1px solid var(--line-strong); }
.ne-btn--ghost:hover{ background:#fff; transform:translateY(-2px); }
.ne-btn--light{ background:var(--bone); color:var(--spruce); }
.ne-btn--light:hover{ background:#fff; transform:translateY(-2px); }
.ne-trust{ margin:22px 0 0; font-size:14.5px; color:var(--muted); display:flex; align-items:center; gap:10px; }
.ne-stars{ color:var(--clay); letter-spacing:2px; }
.ne-hero .ne-media{ position:relative; }
.ne-hero .ne-media img{
  width:100%; height:auto; display:block; border-radius:22px;
  box-shadow:var(--shadow-soft);
  background:linear-gradient(160deg,#fff,#efe8dd);
}
.ne-hero .ne-badge{
  position:absolute; left:-14px; bottom:26px;
  background:#fff; border:1px solid var(--line); border-radius:16px;
  padding:14px 18px; box-shadow:var(--shadow-card);
  font-size:14px; font-weight:600; color:var(--ink); max-width:188px; line-height:1.4;
}
.ne-hero .ne-badge b{ color:var(--spruce); }
@media(max-width:880px){
  .ne-hero .ne-grid{ grid-template-columns:1fr; gap:40px; }
  .ne-hero .ne-media{ order:-1; }
}

/* ---------- problem ---------- */
.ne-problem{ background:var(--bone); }
.ne-problem .ne-inner{ max-width:860px; }
.ne-problem h2{ font-size:clamp(28px,3.6vw,40px); }
.ne-problem .ne-lead{ font-size:21px; max-width:760px; }

/* ---------- steps ---------- */
.ne-steps{ background:var(--spruce); color:var(--sage); }
.ne-steps h2{ color:#fff; }
.ne-steps .ne-kicker{ color:#E9A98F; }
.ne-steps .ne-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:46px; }
.ne-step{
  border:1px solid rgba(220,230,221,.18); border-radius:18px; padding:30px 28px;
  background:rgba(255,255,255,.03);
}
.ne-step .num{
  font-family:var(--font-display); font-size:20px; font-weight:600;
  width:44px; height:44px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:var(--clay); color:#fff; margin-bottom:20px;
}
.ne-step h3{ font-family:var(--font-display); font-weight:560; font-size:23px; color:#fff; margin:0 0 10px; }
.ne-step p{ color:rgba(220,230,221,.82); font-size:16.5px; margin:0; }
@media(max-width:780px){ .ne-steps .ne-cards{ grid-template-columns:1fr; } }

/* ---------- benefits ---------- */
.ne-benefits{ background:var(--bone); }
.ne-benefits .ne-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px; margin-top:44px; }
.ne-benefit{ border-top:2px solid var(--clay); padding-top:22px; }
.ne-benefit h3{ font-family:var(--font-display); font-weight:560; font-size:22px; margin:0 0 10px; color:var(--ink); }
.ne-benefit p{ color:var(--muted); font-size:16.5px; margin:0; }
@media(max-width:780px){ .ne-benefits .ne-cards{ grid-template-columns:1fr; gap:26px; } }

/* ---------- reviews ---------- */
.ne-reviews{ background:var(--bone-2); }
.ne-reviews .ne-cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; margin-top:44px; }
.ne-review{
  background:#fff; border:1px solid var(--line); border-radius:18px; padding:30px 28px;
  box-shadow:var(--shadow-card); transition:transform .2s ease;
}
.ne-review:hover{ transform:translateY(-4px); }
.ne-review .ne-stars{ font-size:16px; }
.ne-review blockquote{
  font-family:var(--font-display); font-weight:440; font-style:italic;
  font-size:19px; line-height:1.5; color:var(--ink); margin:14px 0 18px;
}
.ne-review .who{ font-size:14.5px; font-weight:600; color:var(--spruce); }
@media(max-width:780px){ .ne-reviews .ne-cards{ grid-template-columns:1fr; } }

/* ---------- guarantee ---------- */
.ne-guarantee{ background:var(--spruce-2); color:var(--sage); }
.ne-guarantee .ne-inner{ max-width:760px; text-align:center; }
.ne-guarantee h2{ color:#fff; font-size:clamp(28px,3.6vw,42px); }
.ne-guarantee p{ color:rgba(220,230,221,.85); font-size:19px; margin:0 auto 30px; max-width:38em; }
.ne-guarantee .ne-seal{
  display:inline-flex; align-items:center; gap:10px; margin-bottom:22px;
  font-size:13px; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:#E9A98F;
}

/* ---------- faq ---------- */
.ne-faq{ background:var(--bone); }
.ne-faq .ne-inner{ max-width:820px; }
.ne-faq .ne-items{ margin-top:36px; border-top:1px solid var(--line); }
.ne-faq details{ border-bottom:1px solid var(--line); }
.ne-faq summary{
  list-style:none; cursor:pointer; padding:24px 4px;
  font-family:var(--font-display); font-weight:560; font-size:21px; color:var(--ink);
  display:flex; justify-content:space-between; align-items:center; gap:20px;
}
.ne-faq summary::-webkit-details-marker{ display:none; }
.ne-faq summary::after{ content:"+"; font-family:var(--font-body); font-weight:400; font-size:26px; color:var(--clay); transition:transform .2s ease; }
.ne-faq details[open] summary::after{ transform:rotate(45deg); }
.ne-faq details p{ margin:0 4px 26px; color:var(--muted); font-size:17px; max-width:60em; }

/* ---------- footer ---------- */
.ne-footer{ background:var(--ink); color:rgba(246,242,236,.72); padding:64px 28px 34px; }
.ne-footer .ne-inner{ max-width:var(--container); margin:0 auto; }
.ne-footer .ne-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:40px; padding-bottom:42px; border-bottom:1px solid rgba(246,242,236,.12); }
.ne-footer .ne-logo{ color:#fff; font-size:22px; margin-bottom:14px; }
.ne-footer .blurb{ font-size:15px; line-height:1.6; max-width:30em; color:rgba(246,242,236,.6); }
.ne-footer h4{ font-family:var(--font-body); font-size:13px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:rgba(246,242,236,.5); margin:0 0 16px; }
.ne-footer ul{ list-style:none; margin:0; padding:0; }
.ne-footer ul li{ margin-bottom:10px; }
.ne-footer ul a{ color:rgba(246,242,236,.78); text-decoration:none; font-size:15px; transition:color .2s ease; }
.ne-footer ul a:hover{ color:#fff; }
.ne-footer .ne-bottom{ display:flex; justify-content:space-between; align-items:center; gap:18px; padding-top:24px; font-size:13.5px; color:rgba(246,242,236,.5); flex-wrap:wrap; }
.ne-footer .pays{ display:flex; gap:8px; align-items:center; }
.ne-footer .pays span{ font-size:11px; font-weight:700; letter-spacing:.06em; color:rgba(246,242,236,.6); border:1px solid rgba(246,242,236,.2); border-radius:6px; padding:4px 8px; }
@media(max-width:820px){
  .ne-footer .ne-top{ grid-template-columns:1fr 1fr; gap:30px; }
  .ne-footer .ne-bottom{ flex-direction:column; align-items:flex-start; }
}

/* ---------- motion ---------- */
@keyframes ne-rise{ from{ opacity:0; transform:translateY(16px);} to{ opacity:1; transform:none; } }
.ne-hero h1, .ne-hero .ne-sub, .ne-hero .ne-price, .ne-hero .ne-actions, .ne-hero .ne-trust, .ne-hero .ne-media{
  animation:ne-rise .7s cubic-bezier(.2,.7,.2,1) both;
}
.ne-hero .ne-sub{ animation-delay:.08s; }
.ne-hero .ne-price{ animation-delay:.16s; }
.ne-hero .ne-actions{ animation-delay:.24s; }
.ne-hero .ne-trust{ animation-delay:.32s; }
.ne-hero .ne-media{ animation-delay:.12s; }
@media(prefers-reduced-motion:reduce){
  *{ animation:none !important; transition:none !important; }
}

/* tame theme defaults that could interfere */
.wp-site-blocks{ padding:0 !important; }
