/* =========================================================
   DEEPNATURE FAQ V1 — PREMIUM HELP CENTER
   ========================================================= */

.dnfaq-page{
  --fq-ink:#17283d;
  --fq-copy:#5d6a7b;
  --fq-muted:#8a94a0;
  --fq-gold:#d1a052;
  --fq-line:#e5dfd6;
  --fq-ivory:#f8f5ef;
  background:#fff;
}
.dnfaq-main h1,.dnfaq-main h2,.dnfaq-main h3{
  margin:0;
  font-family:"Cormorant Garamond",Georgia,serif!important;
  font-weight:600;
}
.dnfaq-main p{font-family:"Manrope",Arial,sans-serif!important}

/* HERO */
.dnfaq-hero{
  position:relative;
  overflow:hidden;
  color:#fff;
  background:
    radial-gradient(circle at 92% 5%,rgba(45,170,179,.13),transparent 27%),
    radial-gradient(circle at 4% 0%,rgba(100,67,187,.14),transparent 26%),
    linear-gradient(124deg,#17122d 0%,#111d35 59%,#0b3038 100%);
}
.dnfaq-hero:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(209,160,82,.48),transparent);
}
.dnfaq-hero-grid{
  min-height:350px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 410px;
  gap:86px;
  align-items:center;
  padding-top:40px;
  padding-bottom:50px;
}
.dnfaq-breadcrumb{
  display:flex;align-items:center;gap:8px;margin-bottom:29px;
  color:rgba(255,255,255,.32);
  font:700 7px "Manrope",Arial,sans-serif;
  letter-spacing:.09em;text-transform:uppercase;
}
.dnfaq-breadcrumb a{color:rgba(255,255,255,.52)!important}
.dnfaq-breadcrumb i{font-size:9px;color:rgba(209,160,82,.74)}
.dnfaq-eyebrow{
  display:block;margin-bottom:15px;
  color:#dcb05f;
  font:800 8px "Manrope",Arial,sans-serif;
  letter-spacing:.24em;
}
.dnfaq-hero h1{
  max-width:760px;
  color:#fff;
  font-size:60px;
  line-height:.95;
  letter-spacing:-.027em;
}
.dnfaq-hero h1 em{font-style:italic;color:#efc577;font-weight:500}
.dnfaq-hero-copy>p{
  max-width:620px;
  margin:22px 0 0!important;
  color:rgba(255,255,255,.67)!important;
  font-size:11.5px!important;
  line-height:1.8!important;
}

/* HERO SEARCH */
.dnfaq-hero-search{
  padding:2px 0 4px 30px;
  border-left:1px solid rgba(209,160,82,.43);
}
.dnfaq-hero-search>span{
  display:block;margin-bottom:8px;
  color:#dcb05f;
  font:800 7px "Manrope",Arial,sans-serif;
  letter-spacing:.22em;
}
.dnfaq-hero-search>strong{
  display:block;
  color:#fff;
  font:600 22px/1.15 "Cormorant Garamond",Georgia,serif;
}
.dnfaq-search-box{
  height:48px;
  display:grid;
  grid-template-columns:38px 1fr 38px;
  align-items:center;
  margin-top:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.17);
  border-radius:999px;
  background:rgba(255,255,255,.07);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.dnfaq-search-box>i{
  text-align:center;
  color:rgba(255,255,255,.48);
  font-size:11px;
}
.dnfaq-search-box input{
  min-width:0;
  height:100%;
  border:0!important;
  outline:0!important;
  background:transparent!important;
  color:#fff!important;
  font:600 10px "Manrope",Arial,sans-serif!important;
}
.dnfaq-search-box input::placeholder{color:rgba(255,255,255,.40)}
.dnfaq-search-box button{
  width:38px;height:38px;
  display:grid;place-items:center;
  border:0;
  background:transparent;
  color:rgba(255,255,255,.48);
  cursor:pointer;
  opacity:0;
  pointer-events:none;
  transition:.18s ease;
}
.dnfaq-search-box.has-value button{opacity:1;pointer-events:auto}
.dnfaq-hero-search>small{
  display:block;margin-top:10px;
  color:rgba(255,255,255,.38);
  font:650 7px "Manrope",Arial,sans-serif;
}

/* CATEGORIES */
.dnfaq-categories{
  background:#fff;
  border-bottom:1px solid var(--fq-line);
  box-shadow:0 8px 26px rgba(23,40,61,.025);
}
.dnfaq-categories .dn2-shell{
  min-height:86px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  overflow-x:auto;
  scrollbar-width:none;
}
.dnfaq-categories .dn2-shell::-webkit-scrollbar{display:none}
.dnfaq-categories a{
  flex:0 0 auto;
  min-height:46px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border:1px solid transparent;
  border-radius:999px;
  color:#667383!important;
  font:750 11.5px/1 "Manrope",Arial,sans-serif;
  letter-spacing:-.01em;
  white-space:nowrap;
  transition:color .18s ease,background .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.dnfaq-categories a:hover{
  color:#17283d!important;
  background:#f8f5ef;
  border-color:#e8e1d7;
  transform:translateY(-1px);
}
.dnfaq-categories a.is-active{
  color:#fff!important;
  background:linear-gradient(135deg,#172a3f,#203a50);
  border-color:#172a3f;
  font-weight:800;
  box-shadow:0 10px 24px rgba(24,42,62,.16);
}

/* CONTENT */
.dnfaq-content{
  padding:72px 0 82px;
  background:
    radial-gradient(circle at 92% 4%,rgba(49,171,178,.035),transparent 24%),
    var(--fq-ivory);
}
.dnfaq-layout{
  display:grid;
  grid-template-columns:245px minmax(0,1fr);
  gap:58px;
  align-items:start;
}
.dnfaq-side{
  position:sticky;
  top:110px;
  padding:4px 34px 4px 0;
  border-right:1px solid var(--fq-line);
}
.dnfaq-side-kicker{
  display:block;
  color:#ae813a;
  font:800 7.5px "Manrope",Arial,sans-serif;
  letter-spacing:.24em;
}
.dnfaq-side h2{
  margin-top:14px;
  color:#17283d;
  font-size:35px;
  line-height:1.02;
}
.dnfaq-side>p{
  margin:10px 0 0!important;
  color:#9aa1aa!important;
  font-size:9px!important;
}
.dnfaq-side-line{
  width:34px;height:1px;
  margin:26px 0;
  background:#d3a354;
}
.dnfaq-side>strong{
  display:block;
  color:#24364a;
  font:600 18px/1.15 "Cormorant Garamond",Georgia,serif;
}
.dnfaq-side>small{
  display:block;
  max-width:180px;
  margin-top:8px;
  color:#929aa4;
  font:600 8.5px/1.6 "Manrope",Arial,sans-serif;
}
.dnfaq-side>a{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin-top:20px;
  color:#1e7d84!important;
  font:800 8px "Manrope",Arial,sans-serif;
  letter-spacing:.05em;
}

/* ACCORDION */
.dnfaq-list{
  overflow:hidden;
  border:1px solid #e5ded4;
  border-radius:20px;
  background:#fff;
  box-shadow:0 24px 68px rgba(24,33,47,.06);
}
.dnfaq-item{
  position:relative;
  border-bottom:1px solid var(--fq-line);
  transition:background .2s ease;
}
.dnfaq-item:last-child{border-bottom:0}
.dnfaq-item:hover{background:#fdfcf9}
.dnfaq-item.is-open{background:#fff}
.dnfaq-question{
  width:100%;
  min-height:78px;
  display:grid;
  grid-template-columns:54px minmax(0,1fr) 44px;
  gap:18px;
  align-items:center;
  padding:0 24px 0 20px;
  border:0;
  background:transparent;
  text-align:left;
  cursor:pointer;
}
.dnfaq-number{
  color:#b7a381;
  font:750 8px "Manrope",Arial,sans-serif;
  letter-spacing:.12em;
}
.dnfaq-question-text{
  color:#1d2e43;
  font:600 18px/1.25 "Cormorant Garamond",Georgia,serif;
}
.dnfaq-toggle{
  position:relative;
  width:34px;height:34px;
  display:grid;place-items:center;
  justify-self:end;
  border:1px solid #e5dfd6;
  border-radius:50%;
  background:#fbf9f5;
  transition:.2s ease;
}
.dnfaq-toggle i{
  position:absolute;
  width:11px;height:1px;
  background:#657181;
  transition:.22s ease;
}
.dnfaq-toggle i+ i{transform:rotate(90deg)}
.dnfaq-item.is-open .dnfaq-toggle{
  border-color:#d8bb8b;
  background:#fff9ef;
}
.dnfaq-item.is-open .dnfaq-toggle i+ i{transform:rotate(0deg)}
.dnfaq-answer{
  display:grid;
  grid-template-rows:0fr;
  transition:grid-template-rows .28s ease;
}
.dnfaq-item.is-open .dnfaq-answer{grid-template-rows:1fr}
.dnfaq-answer-inner{
  min-height:0;
  overflow:hidden;
  max-width:830px;
  padding:0 70px 0 92px;
  color:#5c697a;
  font:400 12px/1.85 "Manrope",Arial,sans-serif!important;
}
.dnfaq-item.is-open .dnfaq-answer-inner{padding-bottom:28px}
.dnfaq-answer-inner p,
.dnfaq-answer-inner div,
.dnfaq-answer-inner span,
.dnfaq-answer-inner li{
  color:#5c697a!important;
  font-family:"Manrope",Arial,sans-serif!important;
  font-size:12px!important;
  line-height:1.85!important;
}
.dnfaq-answer-inner p{margin:0 0 12px!important}
.dnfaq-answer-inner ul,.dnfaq-answer-inner ol{padding-left:18px;margin:10px 0!important}
.dnfaq-answer-inner a{color:#1e7d84!important;text-decoration:underline}

/* FILTERED */
.dnfaq-item.is-filtered-out{display:none}
.dnfaq-empty-search,
.dnfaq-empty{
  min-height:360px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  padding:40px;
  text-align:center;
  border:1px solid #e5ded4;
  border-radius:20px;
  background:#fff;
  box-shadow:0 24px 68px rgba(24,33,47,.05);
}
.dnfaq-empty-search[hidden]{display:none!important}
.dnfaq-empty-search>span,
.dnfaq-empty>span{
  width:52px;height:52px;
  display:grid;place-items:center;
  border-radius:50%;
  background:#faf7f1;
  color:#b7883c;
  font-size:18px;
}
.dnfaq-empty-search strong,
.dnfaq-empty strong{
  margin-top:18px;
  color:#1c2d42;
  font:600 23px/1.15 "Cormorant Garamond",Georgia,serif;
}
.dnfaq-empty-search p,
.dnfaq-empty p{
  max-width:430px;
  margin:10px 0 0!important;
  color:#8b949f!important;
  font-size:9.5px!important;
  line-height:1.65!important;
}
.dnfaq-empty-search a,
.dnfaq-empty a{
  min-height:40px;
  display:inline-flex;align-items:center;
  margin-top:20px;padding:0 16px;
  border-radius:999px;
  background:#17293d;
  color:#fff!important;
  font:800 8px "Manrope",Arial,sans-serif;
  letter-spacing:.08em;
}

/* CTA */
.dnfaq-cta{
  padding:0 0 82px;
  background:var(--fq-ivory);
}
.dnfaq-cta-inner{
  min-height:165px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:48px;
  padding:34px 40px;
  border-radius:18px;
  background:
    radial-gradient(circle at 92% 8%,rgba(51,173,181,.14),transparent 28%),
    linear-gradient(126deg,#17122e,#102039 64%,#0c3239);
  box-shadow:0 22px 56px rgba(19,25,45,.10);
}
.dnfaq-cta-inner>div:first-child>span{
  color:#d7aa58;
  font:800 7.5px "Manrope",Arial,sans-serif;
  letter-spacing:.22em;
}
.dnfaq-cta h2{
  margin-top:9px;
  color:#fff;
  font-size:36px;
  line-height:1;
}
.dnfaq-cta-inner p{
  margin:8px 0 0!important;
  color:rgba(255,255,255,.46)!important;
  font-size:9.5px!important;
}
.dnfaq-cta-actions{
  display:flex;align-items:center;gap:16px;
}
.dnfaq-cta-primary{
  min-height:46px;
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:0 20px;
  border-radius:999px;
  background:#fff;
  color:#17283d!important;
  font:800 8.5px "Manrope",Arial,sans-serif;
  letter-spacing:.09em;
}
.dnfaq-cta-phone{
  min-height:42px;
  display:inline-flex;align-items:center;gap:8px;
  color:rgba(255,255,255,.64)!important;
  font:750 8.5px "Manrope",Arial,sans-serif;
}

@media(max-width:1100px){
  .dnfaq-hero-grid{grid-template-columns:minmax(0,1fr) 350px;gap:52px}
  .dnfaq-hero h1{font-size:54px}
  .dnfaq-layout{grid-template-columns:215px minmax(0,1fr);gap:40px}
}
@media(max-width:900px){
  .dnfaq-hero-grid{grid-template-columns:1fr;gap:32px;min-height:0}
  .dnfaq-hero-search{padding-left:0;border-left:0;max-width:650px}
  .dnfaq-layout{grid-template-columns:1fr}
  .dnfaq-side{
    position:relative;top:auto;
    display:grid;
    grid-template-columns:1fr auto;
    column-gap:22px;
    padding:0 0 26px;
    border-right:0;
    border-bottom:1px solid var(--fq-line);
  }
  .dnfaq-side-line{display:none}
  .dnfaq-side>strong,.dnfaq-side>small,.dnfaq-side>a{display:none}
}
@media(max-width:767px){
  .dnfaq-hero-grid{padding-top:30px;padding-bottom:38px}
  .dnfaq-breadcrumb{margin-bottom:24px}
  .dnfaq-hero h1{font-size:43px}
  .dnfaq-hero-copy>p{font-size:10.8px!important}
  .dnfaq-hero-search>strong{font-size:19px}
  .dnfaq-categories .dn2-shell{min-height:70px;justify-content:flex-start;gap:6px}
  .dnfaq-categories a{min-height:42px;padding:0 14px;font-size:10.5px}
  .dnfaq-content{padding:48px 0 56px}
  .dnfaq-side{grid-template-columns:1fr}
  .dnfaq-side h2{font-size:30px}
  .dnfaq-question{
    min-height:72px;
    grid-template-columns:34px minmax(0,1fr) 34px;
    gap:12px;
    padding:0 16px;
  }
  .dnfaq-question-text{font-size:16.5px}
  .dnfaq-toggle{width:30px;height:30px}
  .dnfaq-answer-inner{padding-left:62px;padding-right:24px;font-size:11.3px!important}
  .dnfaq-answer-inner p,.dnfaq-answer-inner div,.dnfaq-answer-inner span,.dnfaq-answer-inner li{font-size:11.3px!important;line-height:1.78!important}
  .dnfaq-cta{padding-bottom:62px}
  .dnfaq-cta-inner{display:block;min-height:0;padding:28px 24px}
  .dnfaq-cta h2{font-size:30px}
  .dnfaq-cta-actions{margin-top:23px;flex-direction:column;align-items:stretch}
  .dnfaq-cta-primary{width:100%}
  .dnfaq-cta-phone{justify-content:center}
}
