:root{
  --ink:#31271f;
  --ink-soft:#59483b;
  --muted:#8d7a65;

  --bg:#f6eddf;
  --bg-soft:#fbf5eb;
  --paper:#fffaf2;
  --paper-strong:#fffdf8;
  --paper-2:#efe1cc;

  --dark:#3a2d24;
  --dark-2:#2f261f;
  --dark-3:#4b392d;

  --brand:#b77a52;
  --clay:#c98e72;
  --sage:#8fa27b;
  --sand:#d9b986;
  --rose:#b98583;

  --line:#e3d4bd;
  --line-strong:#d6c2a5;

  --shadow-sm:0 12px 30px rgba(82,59,34,.08);
  --shadow-md:0 24px 60px rgba(82,59,34,.13);
  --shadow-lg:0 40px 110px rgba(60,42,25,.20);

  --radius-sm:16px;
  --radius-md:24px;
  --radius-lg:34px;
  --radius-xl:44px;

  --page:1240px;
}

/* =========================================================
   RESET
========================================================= */

*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  scroll-behavior:smooth;
}

body{
  margin:0;
  min-height:100vh;
  font-family:Inter,"Segoe UI",system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--ink);
  background:
    radial-gradient(circle at 5% 4%,rgba(201,142,114,.19),transparent 27%),
    radial-gradient(circle at 93% 9%,rgba(143,162,123,.18),transparent 29%),
    linear-gradient(135deg,#fff9ef 0%,#f6eddf 46%,#ead8bf 100%);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.18;
  background-image:
    linear-gradient(30deg,rgba(96,68,40,.08) 12%,transparent 12.5%,transparent 87%,rgba(96,68,40,.08) 87.5%),
    linear-gradient(150deg,rgba(96,68,40,.06) 12%,transparent 12.5%,transparent 87%,rgba(96,68,40,.06) 87.5%);
  background-size:80px 138px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}

img{
  max-width:100%;
  display:block;
}

a{
  color:inherit;
  text-decoration:none;
}

button,
input,
select,
textarea{
  font:inherit;
}

button{
  cursor:pointer;
}

h1,
h2,
h3,
h4,
p{
  margin-top:0;
}

::selection{
  background:rgba(183,122,82,.22);
}

/* =========================================================
   GLOBAL LAYOUT
========================================================= */

.page-shell{
  width:min(calc(100% - 48px),var(--page));
  margin-inline:auto;
}

.page-shell.narrow{
  width:min(calc(100% - 48px),900px);
}

.section{
  position:relative;
  padding:104px 0;
}

.section-heading{
  max-width:760px;
  margin-bottom:42px;
}

.section-heading.centered{
  margin-inline:auto;
  text-align:center;
}

.section-heading h2{
  margin-bottom:18px;
  font-size:clamp(36px,5vw,58px);
  line-height:1.02;
  letter-spacing:-.055em;
}

.section-heading p{
  margin-bottom:0;
  color:var(--muted);
  font-size:17px;
  line-height:1.7;
}

.eyebrow{
  margin-bottom:14px;
  color:#98633f;
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}

.eyebrow.light{
  color:#e6c89f;
}

/* =========================================================
   HEADER
========================================================= */

.site-header{
  position:sticky;
  top:0;
  z-index:100;
  padding:18px 0 0;
  pointer-events:none;
}

.nav-shell{
  width:min(calc(100% - 36px),var(--page));
  min-height:72px;
  margin-inline:auto;
  padding:10px 12px 10px 15px;
  display:flex;
  align-items:center;
  gap:28px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:26px;
  background:rgba(255,250,242,.82);
  box-shadow:0 18px 50px rgba(82,59,34,.10);
  backdrop-filter:blur(20px);
  pointer-events:auto;
}

.brand{
  display:flex;
  align-items:center;
  gap:11px;
  flex:0 0 auto;
}

.brand-mark{
  width:43px;
  height:43px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:15px;
  color:#fff;
  font-size:18px;
  font-weight:950;
  background:linear-gradient(135deg,var(--clay),var(--sand) 58%,var(--sage));
  box-shadow:0 10px 24px rgba(176,116,73,.21);
}

.brand-copy{
  display:grid;
  gap:1px;
}

.brand-copy strong{
  font-size:16px;
  line-height:1.15;
  letter-spacing:-.025em;
}

.brand-copy small{
  color:var(--muted);
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.nav-links{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:8px;
}

.nav-links a{
  padding:11px 13px;
  border-radius:13px;
  color:#6e5d4d;
  font-size:13px;
  font-weight:800;
  transition:.18s ease;
}

.nav-links a:hover{
  color:var(--ink);
  background:var(--paper-2);
}

.nav-cta{
  padding:13px 18px;
  flex:0 0 auto;
  border-radius:15px;
  color:#fff;
  font-size:13px;
  font-weight:900;
  background:linear-gradient(135deg,var(--brand),var(--clay) 55%,var(--sage));
  box-shadow:0 12px 26px rgba(148,92,45,.19);
  transition:.18s ease;
}

.nav-cta:hover{
  transform:translateY(-1px);
  box-shadow:0 16px 32px rgba(148,92,45,.24);
}

/* =========================================================
   BUTTONS
========================================================= */

.button{
  min-height:51px;
  padding:14px 20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:17px;
  font-size:14px;
  font-weight:900;
  transition:
    transform .18s ease,
    box-shadow .18s ease,
    background .18s ease;
}

.button:hover{
  transform:translateY(-2px);
}

.button-primary{
  color:#fff;
  background:linear-gradient(135deg,var(--brand),var(--clay) 54%,var(--sage));
  box-shadow:0 16px 34px rgba(148,92,45,.23);
}

.button-primary:hover{
  box-shadow:0 20px 42px rgba(148,92,45,.28);
}

.button-secondary{
  color:var(--ink);
  border:1px solid var(--line);
  background:rgba(255,250,242,.72);
  box-shadow:0 10px 24px rgba(82,59,34,.06);
}

.button-large{
  width:100%;
  min-height:58px;
  font-size:15px;
}

.coming-soon{
  cursor:default;
}

.coming-soon:hover{
  transform:none;
}

/* =========================================================
   HERO
========================================================= */

.hero{
  position:relative;
  min-height:860px;
  padding:126px 0 86px;
  overflow:hidden;
}

.hero-glow{
  position:absolute;
  border-radius:999px;
  filter:blur(1px);
  pointer-events:none;
}

.hero-glow-one{
  width:620px;
  height:620px;
  left:-300px;
  top:-100px;
  background:radial-gradient(circle,rgba(201,142,114,.18),transparent 69%);
}

.hero-glow-two{
  width:680px;
  height:680px;
  right:-280px;
  top:10px;
  background:radial-gradient(circle,rgba(143,162,123,.18),transparent 70%);
}

.hero-layout{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:minmax(0,.86fr) minmax(570px,1.14fr);
  gap:72px;
  align-items:center;
}

.hero-copy{
  max-width:570px;
}

.hero h1{
  margin-bottom:24px;
  font-size:clamp(58px,6vw,86px);
  line-height:.92;
  letter-spacing:-.075em;
}

.hero h1 span{
  display:block;
  margin-top:8px;
  color:#a16b47;
}

.hero-lead{
  max-width:540px;
  margin-bottom:29px;
  color:#746252;
  font-size:18px;
  line-height:1.7;
}

.hero-actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.hero-note{
  margin-top:24px;
  display:flex;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  color:#7f6e5c;
  font-size:11px;
  font-weight:800;
}

.hero-product{
  position:relative;
}

.hero-product::before{
  content:"";
  position:absolute;
  inset:12% 5% -8% 5%;
  z-index:-1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(81,56,35,.20),transparent 70%);
  filter:blur(30px);
}

/* =========================================================
   APP PREVIEW
========================================================= */

.app-preview{
  min-height:520px;
  display:grid;
  grid-template-columns:170px minmax(0,1fr);
  border:1px solid rgba(255,255,255,.70);
  border-radius:31px;
  overflow:hidden;
  background:#f8efe3;
  box-shadow:
    0 48px 110px rgba(67,46,29,.20),
    0 0 0 1px rgba(95,68,43,.06);
  transform:perspective(1300px) rotateY(-3deg) rotateX(1deg);
  transform-origin:center;
}

.preview-sidebar{
  position:relative;
  padding:20px 15px;
  color:#fff;
  background:
    radial-gradient(circle at 0 0,rgba(217,185,134,.25),transparent 32%),
    radial-gradient(circle at 100% 100%,rgba(143,162,123,.22),transparent 38%),
    linear-gradient(180deg,#423329,#302720 72%,#5b3f2c);
}

.preview-brand{
  display:flex;
  align-items:center;
  gap:9px;
  margin-bottom:26px;
}

.preview-logo{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:linear-gradient(135deg,var(--clay),var(--sand),var(--sage));
  font-size:13px;
  font-weight:950;
}

.preview-brand strong{
  display:block;
  font-size:11px;
}

.preview-brand small{
  display:block;
  margin-top:2px;
  color:rgba(255,255,255,.5);
  font-size:6px;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}

.preview-nav{
  display:grid;
  gap:7px;
}

.preview-nav span{
  padding:9px 10px;
  border-radius:11px;
  color:rgba(255,255,255,.60);
  font-size:8px;
  font-weight:800;
}

.preview-nav span.active{
  color:#392a1e;
  background:#fff6e8;
  box-shadow:0 10px 24px rgba(0,0,0,.16);
}

.preview-main{
  padding:26px 25px 24px;
  background:
    radial-gradient(circle at 95% 3%,rgba(143,162,123,.11),transparent 26%),
    linear-gradient(145deg,#fffaf1,#f5eadb);
}

.preview-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:20px;
}

.preview-heading small{
  color:#9e6f49;
  font-size:7px;
  font-weight:950;
  letter-spacing:.12em;
}

.preview-heading h3{
  margin:6px 0 0;
  font-size:23px;
  letter-spacing:-.045em;
}

.preview-avatar{
  width:35px;
  height:35px;
  border-radius:13px;
  border:1px solid #ddc9ac;
  background:linear-gradient(145deg,#ead2af,#c89171);
}

.preview-stats{
  margin-top:23px;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}

.preview-stats>div{
  min-height:74px;
  padding:13px;
  border:1px solid rgba(216,196,167,.72);
  border-radius:15px;
  background:rgba(255,253,248,.82);
  box-shadow:0 8px 22px rgba(82,59,34,.05);
}

.preview-stats small{
  display:block;
  color:#8f7c69;
  font-size:7px;
  font-weight:800;
}

.preview-stats strong{
  display:block;
  margin-top:6px;
  font-size:22px;
  letter-spacing:-.04em;
}

.preview-grid{
  margin-top:12px;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(130px,.65fr);
  gap:10px;
}

.preview-card{
  min-height:170px;
  padding:16px;
  border:1px solid rgba(216,196,167,.72);
  border-radius:17px;
  background:rgba(255,253,248,.84);
  box-shadow:0 10px 24px rgba(82,59,34,.05);
}

.preview-large{
  min-height:246px;
}

.preview-label{
  color:#9b6c45;
  font-size:7px;
  font-weight:950;
  letter-spacing:.12em;
}

.preview-card h4{
  margin:7px 0 13px;
  font-size:13px;
  letter-spacing:-.025em;
}

.preview-event{
  position:relative;
  margin-top:7px;
  padding:9px 10px 9px 13px;
  overflow:hidden;
  border-radius:10px;
  background:#fff;
}

.preview-event::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
}

.preview-event.clay::before{
  background:var(--clay);
}

.preview-event.sage::before{
  background:var(--sage);
}

.preview-event.sand::before{
  background:var(--sand);
}

.preview-event b{
  display:block;
  font-size:8px;
}

.preview-event small{
  display:block;
  margin-top:3px;
  color:#8b7762;
  font-size:6px;
}

.preview-progress{
  margin-top:25px;
  text-align:center;
}

.preview-progress strong{
  display:block;
  font-size:34px;
  letter-spacing:-.06em;
}

.preview-progress small{
  display:block;
  color:#8f7c69;
  font-size:7px;
}

.progress-track{
  height:7px;
  margin-top:16px;
  overflow:hidden;
  border-radius:999px;
  background:#eee2d0;
}

.progress-track span{
  display:block;
  width:64%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--clay),var(--sand),var(--sage));
}

/* =========================================================
   INTRO
========================================================= */

.intro-section{
  padding-top:118px;
}

.intro-section::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:min(88%,1080px);
  height:1px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,transparent,var(--line-strong),transparent);
}

/* =========================================================
   FEATURES
========================================================= */

.feature-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
}

.feature-card{
  position:relative;
  min-height:310px;
  padding:32px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.76);
  border-radius:30px;
  background:rgba(255,250,242,.83);
  box-shadow:var(--shadow-sm);
  backdrop-filter:blur(16px);
  transition:.2s ease;
}

.feature-card:hover{
  transform:translateY(-3px);
  box-shadow:var(--shadow-md);
}

.feature-card-large{
  grid-column:1/-1;
  min-height:350px;
  padding-right:47%;
}

.feature-card-large::after{
  content:"";
  position:absolute;
  width:390px;
  height:390px;
  right:-70px;
  bottom:-150px;
  border-radius:50%;
  background:
    radial-gradient(circle at 35% 30%,rgba(217,185,134,.42),rgba(201,142,114,.24) 43%,rgba(143,162,123,.14) 65%,transparent 72%);
}

.feature-number{
  display:inline-grid;
  place-items:center;
  width:38px;
  height:38px;
  margin-bottom:35px;
  border:1px solid var(--line);
  border-radius:13px;
  color:#90623f;
  background:var(--paper-strong);
  font-size:10px;
  font-weight:950;
}

.feature-card h3{
  max-width:490px;
  margin-bottom:14px;
  font-size:28px;
  line-height:1.08;
  letter-spacing:-.04em;
}

.feature-card p{
  max-width:580px;
  margin-bottom:0;
  color:var(--muted);
  font-size:14px;
  line-height:1.7;
}

.mini-semester{
  position:absolute;
  z-index:2;
  right:35px;
  top:50%;
  width:360px;
  padding:21px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  transform:translateY(-50%);
  border:1px solid rgba(255,255,255,.82);
  border-radius:21px;
  background:rgba(255,253,248,.88);
  box-shadow:0 18px 42px rgba(82,59,34,.10);
}

.mini-semester small{
  display:block;
  margin-bottom:5px;
  color:#9b6c45;
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.mini-semester strong{
  display:block;
  font-size:12px;
}

.mini-semester>span{
  color:#7d9471;
  font-size:28px;
  font-weight:950;
  letter-spacing:-.05em;
}

/* =========================================================
   STATEMENT / DIFFERENTIATOR
========================================================= */

.statement-section{
  padding-top:78px;
  padding-bottom:78px;
}

.statement-card{
  position:relative;
  padding:54px;
  display:grid;
  grid-template-columns:minmax(0,1.05fr) minmax(360px,.95fr);
  gap:70px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  border-radius:38px;
  color:#fff;
  background:
    radial-gradient(circle at 8% 15%,rgba(217,185,134,.22),transparent 32%),
    radial-gradient(circle at 92% 84%,rgba(143,162,123,.19),transparent 31%),
    linear-gradient(145deg,#3d3027,#29221d);
  box-shadow:0 34px 86px rgba(54,38,25,.23);
}

.statement-copy h2{
  max-width:650px;
  margin-bottom:19px;
  font-size:clamp(39px,5vw,62px);
  line-height:.98;
  letter-spacing:-.06em;
}

.statement-copy p{
  max-width:600px;
  margin-bottom:0;
  color:rgba(255,255,255,.65);
  font-size:16px;
  line-height:1.72;
}

.statement-points{
  display:grid;
}

.statement-points>div{
  padding:20px 0;
  border-bottom:1px solid rgba(255,255,255,.11);
}

.statement-points>div:first-child{
  padding-top:0;
}

.statement-points>div:last-child{
  padding-bottom:0;
  border-bottom:0;
}

.statement-points strong{
  display:block;
  margin-bottom:6px;
  color:#fff6e8;
  font-size:14px;
}

.statement-points span{
  display:block;
  color:rgba(255,255,255,.55);
  font-size:12px;
  line-height:1.6;
}

/* =========================================================
   PRICING
========================================================= */

.pricing-section{
  padding-top:118px;
}

.pricing-card{
  overflow:hidden;
  border:1px solid rgba(255,255,255,.78);
  border-radius:34px;
  background:rgba(255,250,242,.90);
  box-shadow:var(--shadow-md);
  backdrop-filter:blur(18px);
}

.pricing-top{
  padding:36px 38px 32px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:40px;
}

.launch-badge{
  display:inline-flex;
  margin-bottom:18px;
  padding:7px 10px;
  border:1px solid #d8c2a2;
  border-radius:999px;
  color:#855936;
  background:#f5e8d5;
  font-size:9px;
  font-weight:950;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.pricing-top h3{
  margin-bottom:7px;
  font-size:31px;
  letter-spacing:-.045em;
}

.pricing-top p{
  margin-bottom:0;
  color:var(--muted);
  font-size:13px;
}

.price{
  min-width:220px;
  text-align:right;
}

.regular-price{
  display:block;
  margin-bottom:1px;
  color:#a69581;
  font-size:13px;
  font-weight:800;
  text-decoration:line-through;
}

.price>div{
  display:flex;
  align-items:baseline;
  justify-content:flex-end;
  gap:7px;
}

.price strong{
  font-size:52px;
  letter-spacing:-.065em;
}

.price small{
  color:#8b7864;
  font-size:12px;
  font-weight:900;
}

.price>span:last-child{
  display:block;
  color:#8c7965;
  font-size:10px;
  font-weight:800;
}

.pricing-divider{
  height:1px;
  margin-inline:38px;
  background:var(--line);
}

.pricing-bottom{
  padding:31px 38px 37px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 270px;
  gap:46px;
  align-items:end;
}

.pricing-bottom ul{
  margin:0;
  padding:0;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:12px 24px;
  list-style:none;
}

.pricing-bottom li{
  position:relative;
  padding-left:24px;
  color:#645344;
  font-size:12px;
  font-weight:750;
  line-height:1.45;
}

.pricing-bottom li::before{
  content:"✓";
  position:absolute;
  left:0;
  top:-1px;
  width:17px;
  height:17px;
  display:grid;
  place-items:center;
  border-radius:50%;
  color:#5f794e;
  background:#e7eedc;
  font-size:9px;
  font-weight:950;
}

.purchase-area{
  display:grid;
  gap:10px;
  text-align:center;
}

.purchase-area small{
  color:#9a8875;
  font-size:9px;
}

.guarantee{
  margin-top:18px;
  padding:22px 24px;
  display:flex;
  align-items:center;
  gap:17px;
  border:1px solid rgba(143,162,123,.30);
  border-radius:24px;
  background:rgba(234,240,223,.70);
}

.guarantee-icon{
  width:48px;
  height:48px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  border-radius:17px;
  color:#fff;
  background:linear-gradient(145deg,#80966e,#a5b78e);
  box-shadow:0 11px 26px rgba(107,130,89,.18);
  font-size:18px;
  font-weight:950;
}

.guarantee strong{
  display:block;
  margin-bottom:5px;
  font-size:13px;
}

.guarantee p{
  margin-bottom:0;
  color:#718065;
  font-size:11px;
  line-height:1.55;
}

/* =========================================================
   REQUIREMENTS
========================================================= */

.requirements-section{
  padding-top:60px;
  padding-bottom:80px;
}

.requirements-card{
  padding:42px 44px;
  display:grid;
  grid-template-columns:minmax(300px,.75fr) minmax(0,1.25fr);
  gap:70px;
  align-items:center;
  border:1px solid rgba(255,255,255,.75);
  border-radius:32px;
  background:rgba(255,250,242,.72);
  box-shadow:var(--shadow-sm);
}

.requirements-card h2{
  margin-bottom:11px;
  font-size:38px;
  letter-spacing:-.05em;
}

.requirements-card p{
  max-width:430px;
  margin-bottom:0;
  color:var(--muted);
  font-size:13px;
  line-height:1.65;
}

.requirements-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  border:1px solid var(--line);
  border-radius:20px;
  overflow:hidden;
  background:rgba(255,253,248,.72);
}

.requirements-list>div{
  padding:18px 20px;
}

.requirements-list>div:nth-child(odd){
  border-right:1px solid var(--line);
}

.requirements-list>div:nth-child(-n+2){
  border-bottom:1px solid var(--line);
}

.requirements-list small{
  display:block;
  margin-bottom:5px;
  color:#96836f;
  font-size:8px;
  font-weight:900;
  letter-spacing:.07em;
  text-transform:uppercase;
}

.requirements-list strong{
  font-size:12px;
}

/* =========================================================
   FAQ
========================================================= */

.faq-list{
  display:grid;
  gap:10px;
}

.faq-list details{
  border:1px solid rgba(255,255,255,.76);
  border-radius:20px;
  background:rgba(255,250,242,.77);
  box-shadow:0 8px 20px rgba(82,59,34,.04);
}

.faq-list summary{
  position:relative;
  padding:20px 54px 20px 22px;
  list-style:none;
  cursor:pointer;
  font-size:13px;
  font-weight:900;
}

.faq-list summary::-webkit-details-marker{
  display:none;
}

.faq-list summary::after{
  content:"+";
  position:absolute;
  right:21px;
  top:50%;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  transform:translateY(-50%);
  border:1px solid var(--line);
  border-radius:10px;
  color:#8d6a4f;
  background:var(--paper-strong);
  font-size:17px;
  font-weight:700;
}

.faq-list details[open] summary::after{
  content:"–";
}

.faq-list details p{
  margin:0;
  padding:0 22px 21px;
  max-width:760px;
  color:var(--muted);
  font-size:12px;
  line-height:1.7;
}

/* =========================================================
   FOOTER
========================================================= */

.site-footer{
  margin-top:30px;
  padding:56px 0 28px;
  color:#fff;
  background:
    radial-gradient(circle at 0 0,rgba(217,185,134,.17),transparent 25%),
    radial-gradient(circle at 100% 100%,rgba(143,162,123,.15),transparent 29%),
    linear-gradient(145deg,#3b2e25,#2b241f);
}

.site-footer .brand-copy strong{
  color:#fff;
}

.site-footer .brand-copy small{
  color:rgba(255,255,255,.46);
}

.footer-layout{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:30px;
}

.footer-brand p{
  margin:18px 0 0;
  color:rgba(255,255,255,.52);
  font-size:12px;
}

.footer-links{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.footer-links a{
  padding:10px 11px;
  border-radius:11px;
  color:rgba(255,255,255,.60);
  font-size:11px;
  font-weight:800;
  transition:.18s ease;
}

.footer-links a:hover{
  color:#fff;
  background:rgba(255,255,255,.07);
}

.footer-bottom{
  margin-top:42px;
  padding-top:21px;
  display:flex;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid rgba(255,255,255,.10);
  color:rgba(255,255,255,.38);
  font-size:9px;
  font-weight:750;
}

/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1100px){

  .hero{
    min-height:auto;
  }

  .hero-layout{
    grid-template-columns:1fr;
    gap:60px;
  }

  .hero-copy{
    max-width:720px;
  }

  .hero-product{
    max-width:800px;
  }

  .app-preview{
    transform:none;
  }

  .statement-card{
    grid-template-columns:1fr;
    gap:45px;
  }

  .requirements-card{
    grid-template-columns:1fr;
    gap:35px;
  }

}

@media(max-width:850px){

  .site-header{
    padding-top:12px;
  }

  .nav-shell{
    min-height:64px;
  }

  .nav-links{
    display:none;
  }

  .nav-cta{
    margin-left:auto;
  }

  .hero{
    padding-top:110px;
  }

  .feature-card-large{
    padding-right:32px;
    padding-bottom:190px;
  }

  .mini-semester{
    left:32px;
    right:32px;
    top:auto;
    bottom:28px;
    width:auto;
    transform:none;
  }

  .pricing-bottom{
    grid-template-columns:1fr;
    gap:28px;
  }

  .purchase-area{
    max-width:330px;
  }

}

@media(max-width:680px){

  .page-shell,
  .page-shell.narrow{
    width:min(calc(100% - 28px),var(--page));
  }

  .section{
    padding:78px 0;
  }

  .nav-shell{
    width:calc(100% - 20px);
    padding:8px 9px 8px 11px;
  }

  .brand-copy small{
    display:none;
  }

  .nav-cta{
    padding:12px 14px;
    font-size:11px;
  }

  .hero{
    padding-top:92px;
    padding-bottom:58px;
  }

  .hero h1{
    font-size:52px;
  }

  .hero-lead{
    font-size:16px;
  }

  .hero-actions{
    display:grid;
    grid-template-columns:1fr;
  }

  .hero-actions .button{
    width:100%;
  }

  .hero-note{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:9px 12px;
  }

  .app-preview{
    min-height:460px;
    grid-template-columns:72px minmax(0,1fr);
    border-radius:24px;
  }

  .preview-sidebar{
    padding:14px 8px;
  }

  .preview-brand{
    justify-content:center;
  }

  .preview-brand>div:last-child{
    display:none;
  }

  .preview-logo{
    width:34px;
    height:34px;
  }

  .preview-nav span{
    padding:8px 5px;
    overflow:hidden;
    text-align:center;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:6px;
  }

  .preview-main{
    padding:18px 14px;
  }

  .preview-heading h3{
    font-size:18px;
  }

  .preview-avatar{
    display:none;
  }

  .preview-stats{
    gap:6px;
  }

  .preview-stats>div{
    padding:9px;
  }

  .preview-stats strong{
    font-size:18px;
  }

  .preview-grid{
    grid-template-columns:1fr;
  }

  .preview-grid>.preview-card:not(.preview-large){
    display:none;
  }

  .feature-grid{
    grid-template-columns:1fr;
  }

  .feature-card,
  .feature-card-large{
    grid-column:auto;
    min-height:auto;
    padding:27px;
  }

  .feature-card-large{
    padding-bottom:180px;
  }

  .mini-semester{
    left:26px;
    right:26px;
  }

  .statement-card{
    padding:34px 27px;
    border-radius:29px;
  }

  .pricing-top{
    padding:28px 25px;
    display:grid;
  }

  .price{
    min-width:0;
    text-align:left;
  }

  .price>div{
    justify-content:flex-start;
  }

  .pricing-divider{
    margin-inline:25px;
  }

  .pricing-bottom{
    padding:26px 25px 30px;
  }

  .pricing-bottom ul{
    grid-template-columns:1fr;
  }

  .requirements-card{
    padding:29px 25px;
  }

  .requirements-list{
    grid-template-columns:1fr;
  }

  .requirements-list>div:nth-child(odd){
    border-right:0;
  }

  .requirements-list>div{
    border-bottom:1px solid var(--line);
  }

  .requirements-list>div:last-child{
    border-bottom:0;
  }

  .footer-layout{
    display:grid;
  }

  .footer-links{
    justify-content:flex-start;
  }

  .footer-bottom{
    display:grid;
  }

}

@media(max-width:420px){

  .hero h1{
    font-size:45px;
  }

  .hero-note{
    grid-template-columns:1fr;
  }

  .app-preview{
    grid-template-columns:59px minmax(0,1fr);
  }

  .preview-nav span{
    font-size:5px;
  }

  .mini-semester{
    align-items:flex-start;
    flex-direction:column;
    gap:10px;
  }

}

/* =========================================================
   ACCESSIBILITY
========================================================= */

a:focus-visible,
button:focus-visible,
summary:focus-visible{
  outline:3px solid rgba(183,122,82,.34);
  outline-offset:3px;
}

@media(prefers-reduced-motion:reduce){

  html{
    scroll-behavior:auto;
  }

  *,
  *::before,
  *::after{
    scroll-behavior:auto!important;
    transition:none!important;
    animation:none!important;
  }

}


/* STDNTOS ACCURATE APP PREVIEW V2
============================================================ */

.accurate-app-preview{
  grid-template-columns:154px minmax(0,1fr);
  min-height:520px;
  overflow:hidden;
}


/* Sidebar */

.accurate-app-preview .preview-sidebar{
  display:flex;
  flex-direction:column;
  padding:16px 13px;
}

.accurate-app-preview .preview-brand{
  margin-bottom:16px;
}

.accurate-preview-nav{
  display:grid;
  gap:4px;
}

.accurate-preview-nav span{
  display:block;
  padding:7px 9px;
  border-radius:10px;
  color:rgba(255,255,255,.62);
  font-size:6.5px;
  font-weight:800;
}

.accurate-preview-nav span.active{
  color:#38291d;
  background:#fff7ea;
}

.accurate-semester{
  margin-top:auto;
  padding:10px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(255,255,255,.08);
}

.accurate-semester strong{
  display:block;
  color:#fff;
  font-size:7px;
}

.accurate-semester small{
  display:block;
  margin-top:3px;
  color:rgba(255,255,255,.58);
  font-size:5.5px;
  font-weight:700;
}

.accurate-semester-meter{
  height:5px;
  margin-top:8px;
  overflow:hidden;
  border-radius:999px;
  background:rgba(255,255,255,.15);
}

.accurate-semester-meter span{
  display:block;
  width:64%;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(
    90deg,
    #fff,
    var(--sand),
    var(--sage)
  );
}


/* Dashboard shell */

.accurate-dashboard{
  display:grid;
  grid-template-columns:minmax(0,1.18fr) minmax(135px,.82fr);
  gap:9px;
  align-items:start;
  padding:13px;
  background:
    radial-gradient(
      circle at 90% 3%,
      rgba(143,162,123,.15),
      transparent 29%
    ),
    linear-gradient(
      135deg,
      #fff8ed,
      #f4eadb 52%,
      #ead7bd
    );
}

.accurate-dashboard-left,
.accurate-dashboard-right{
  display:grid;
  gap:8px;
}


/* Main dashboard hero */

.accurate-dashboard-hero{
  position:relative;
  overflow:hidden;
  padding:13px;
  border:1px solid rgba(255,255,255,.82);
  border-radius:16px;
  background:rgba(255,250,242,.9);
  box-shadow:0 9px 20px rgba(82,59,34,.07);
}

.accurate-dashboard-hero:after{
  content:"";
  position:absolute;
  top:-54px;
  right:-48px;
  width:140px;
  height:140px;
  border-radius:50%;
  background:radial-gradient(
    circle,
    rgba(201,142,114,.22),
    rgba(143,162,123,.13),
    transparent 68%
  );
}

.accurate-dashboard-hero>*{
  position:relative;
  z-index:1;
}

.accurate-eyebrow{
  color:#9b6c45;
  font-size:5.5px;
  font-weight:950;
  letter-spacing:.11em;
}

.accurate-dashboard-hero h3{
  max-width:265px;
  margin:6px 0 5px;
  color:#31271f;
  font-size:18px;
  line-height:1;
  letter-spacing:-.05em;
}

.accurate-dashboard-hero p{
  max-width:280px;
  margin:0;
  color:#8d7a65;
  font-size:6px;
  font-weight:700;
  line-height:1.45;
}

.accurate-dashboard-actions{
  display:flex;
  gap:5px;
  margin-top:9px;
}

.accurate-dashboard-actions span{
  display:flex;
  align-items:center;
  min-height:21px;
  padding:0 7px;
  border:1px solid #e3d4bd;
  border-radius:7px;
  background:#fffaf4;
  color:#31271f;
  font-size:5.2px;
  font-weight:900;
}

.accurate-dashboard-actions span.primary{
  border-color:transparent;
  color:#fff;
  background:linear-gradient(
    135deg,
    #b77a52,
    #c98e72 54%,
    #8fa27b
  );
}


/* Dashboard cards */

.accurate-card{
  padding:10px;
  border:1px solid rgba(227,212,189,.9);
  border-radius:15px;
  background:rgba(255,250,242,.9);
  box-shadow:0 8px 18px rgba(82,59,34,.06);
}

.accurate-card-heading{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:6px;
  margin-bottom:7px;
}

.accurate-card-heading strong{
  display:block;
  color:#31271f;
  font-size:8px;
}

.accurate-card-heading small{
  display:block;
  max-width:185px;
  margin-top:2px;
  color:#8d7a65;
  font-size:5px;
  font-weight:700;
  line-height:1.3;
}

.accurate-pill{
  flex:0 0 auto;
  padding:3px 5px;
  border:1px solid #e3d4bd;
  border-radius:999px;
  background:#efe1cc;
  color:#76512d;
  font-size:5px;
}


/* Schoolwork */

.accurate-task{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  margin-top:5px;
  padding:7px 7px 7px 9px;
  border:1px solid #e3d4bd;
  border-left:4px solid #b77a52;
  border-radius:9px;
  background:#fffdf8;
}

.accurate-task.clay{
  border-left-color:#c98e72;
}

.accurate-task.sage{
  border-left-color:#8fa27b;
}

.accurate-task.sand{
  border-left-color:#d9b986;
}

.accurate-task.rose{
  border-left-color:#b98583;
}

.accurate-task>div{
  min-width:0;
}

.accurate-task strong{
  display:block;
  overflow:hidden;
  color:#31271f;
  font-size:6.5px;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.accurate-task small{
  display:block;
  margin-top:2px;
  color:#8d7a65;
  font-size:5px;
  font-weight:700;
}

.accurate-task>span{
  flex:0 0 auto;
  padding:3px 5px;
  border:1px solid #e3d4bd;
  border-radius:999px;
  background:#f4ead8;
  color:#76512d;
  font-size:4.6px;
  font-weight:900;
}


/* Academic Health */

.accurate-health{
  padding:12px;
  border-radius:16px;
  color:#fff;
  background:linear-gradient(
    145deg,
    #3b2d24,
    #7b5634
  );
  box-shadow:0 13px 27px rgba(55,38,23,.24);
}

.accurate-health>span{
  display:block;
  color:#e9c99c;
  font-size:5px;
  font-weight:950;
  letter-spacing:.11em;
}

.accurate-health>strong{
  display:block;
  margin-top:6px;
  color:#fff;
  font-size:11px;
}

.accurate-health>b{
  display:block;
  margin-top:5px;
  color:#fff;
  font-size:25px;
  line-height:1;
  letter-spacing:-.06em;
}

.accurate-health p{
  margin:6px 0 0;
  color:rgba(255,255,255,.76);
  font-size:5px;
  font-weight:700;
  line-height:1.4;
}


/* Grade snapshot */

.accurate-grade{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:7px;
  margin-top:5px;
  padding:6px 7px;
  border:1px solid #e3d4bd;
  border-radius:9px;
  background:#fffdf8;
}

.accurate-grade span{
  display:flex;
  align-items:center;
  gap:4px;
  color:#31271f;
  font-size:5.3px;
  font-weight:800;
}

.accurate-grade i{
  width:6px;
  height:6px;
  border-radius:50%;
}

.accurate-grade .clay-dot{
  background:#c98e72;
}

.accurate-grade .sage-dot{
  background:#8fa27b;
}

.accurate-grade .sand-dot{
  background:#d9b986;
}

.accurate-grade b{
  padding:3px 5px;
  border:1px solid #d2dfc1;
  border-radius:999px;
  background:#eaf0df;
  color:#5f7b48;
  font-size:5px;
}


/* Course Balance */

.accurate-balance{
  margin-top:7px;
}

.accurate-balance>div:first-child{
  display:flex;
  justify-content:space-between;
  gap:6px;
}

.accurate-balance span,
.accurate-balance b{
  color:#604d3d;
  font-size:5px;
  font-weight:800;
}

.accurate-balance b{
  color:#8d7a65;
}

.accurate-balance-track{
  height:5px;
  margin-top:3px;
  overflow:hidden;
  border-radius:999px;
  background:#eee1ce;
}

.accurate-balance-track span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(
    90deg,
    #c98e72,
    #8fa27b
  );
}


/* Responsive preview */

@media(max-width:760px){

  .accurate-app-preview{
    grid-template-columns:72px minmax(0,1fr);
    min-height:460px;
  }

  .accurate-app-preview .preview-sidebar{
    padding:12px 7px;
  }

  .accurate-preview-nav span{
    padding:6px 3px;
    text-align:center;
    font-size:5px;
  }

  .accurate-preview-nav span:nth-child(n+7){
    display:none;
  }

  .accurate-semester{
    display:none;
  }

  .accurate-dashboard{
    grid-template-columns:1fr;
    padding:9px;
  }

  .accurate-dashboard-right{
    display:none;
  }

  .accurate-dashboard-hero h3{
    font-size:15px;
  }

}


/* STDNTOS WEBSITE GRAPHITE DARK MODE
============================================================ */

/* Theme button */

.theme-toggle{
  width:44px;
  height:44px;
  flex:0 0 44px;
  display:grid;
  place-items:center;
  border:1px solid var(--line);
  border-radius:14px;
  color:var(--ink);
  background:var(--paper);
  box-shadow:0 8px 20px rgba(82,59,34,.08);
  transition:
    transform .18s ease,
    background .18s ease,
    border-color .18s ease;
}

.theme-toggle:hover{
  transform:translateY(-2px);
  background:var(--paper-2);
}

.theme-toggle-icon{
  display:block;
  font-size:20px;
  line-height:1;
}


/* ---------------------------------------------------------
   GRAPHITE VARIABLES
--------------------------------------------------------- */

html[data-site-theme="dark"]{

  --ink:#f5f1e8;
  --ink-soft:#ddd5c9;
  --muted:#c7beb0;

  --bg:#151515;
  --bg-soft:#1c1b19;

  --paper:#232220;
  --paper-strong:#2b2926;
  --paper-2:#302c27;

  --dark:#0f0f0f;
  --dark-2:#111110;
  --dark-3:#292521;

  --brand:#d8a15f;
  --sage:#a8bb8f;
  --clay:#c58f70;
  --sand:#d6c48f;
  --rose:#c99a95;

  --line:#49443d;
  --line-strong:#625b51;

  --shadow-sm:0 12px 30px rgba(0,0,0,.20);
  --shadow-md:0 24px 60px rgba(0,0,0,.30);
  --shadow-lg:0 40px 110px rgba(0,0,0,.42);
}


/* ---------------------------------------------------------
   PAGE BACKGROUND
--------------------------------------------------------- */

html[data-site-theme="dark"] body{
  color:var(--ink);
  background:
    radial-gradient(
      circle at 5% 4%,
      rgba(197,143,112,.12),
      transparent 28%
    ),
    radial-gradient(
      circle at 93% 9%,
      rgba(168,187,143,.10),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #151515 0%,
      #1b1a18 50%,
      #211e1a 100%
    );
}

html[data-site-theme="dark"] body::before{
  opacity:.11;
  background-image:
    linear-gradient(
      30deg,
      rgba(255,255,255,.045) 12%,
      transparent 12.5%,
      transparent 87%,
      rgba(255,255,255,.045) 87.5%
    ),
    linear-gradient(
      150deg,
      rgba(255,255,255,.035) 12%,
      transparent 12.5%,
      transparent 87%,
      rgba(255,255,255,.035) 87.5%
    );
}


/* ---------------------------------------------------------
   HEADER
--------------------------------------------------------- */

html[data-site-theme="dark"] .nav-shell{
  border-color:rgba(255,255,255,.09);
  background:rgba(35,34,32,.88);
  box-shadow:0 18px 50px rgba(0,0,0,.30);
}

html[data-site-theme="dark"] .nav-links a{
  color:#c7beb0;
}

html[data-site-theme="dark"] .nav-links a:hover{
  color:var(--ink);
  background:var(--paper-2);
}

html[data-site-theme="dark"] .theme-toggle{
  border-color:var(--line);
  color:var(--ink);
  background:#292724;
  box-shadow:none;
}


/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */

html[data-site-theme="dark"] .hero h1 span{
  color:#d8a15f;
}

html[data-site-theme="dark"] .hero-lead,
html[data-site-theme="dark"] .hero-note{
  color:var(--muted);
}

html[data-site-theme="dark"] .button-secondary{
  color:var(--ink);
  border-color:var(--line);
  background:rgba(43,41,38,.82);
}


/* ---------------------------------------------------------
   ORIGINAL APP PREVIEW
--------------------------------------------------------- */

html[data-site-theme="dark"] .app-preview{
  border-color:#4d4841;
  background:#1c1b19;
  box-shadow:0 30px 75px rgba(0,0,0,.38);
}

html[data-site-theme="dark"] .preview-main{
  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168,187,143,.09),
      transparent 35%
    ),
    linear-gradient(
      145deg,
      #24221f,
      #1c1b19
    );
}

html[data-site-theme="dark"] .preview-stats>div,
html[data-site-theme="dark"] .preview-card,
html[data-site-theme="dark"] .preview-event{
  border-color:#4d4841;
  background:#2b2926;
}

html[data-site-theme="dark"] .preview-event{
  color:var(--ink);
}

html[data-site-theme="dark"] .preview-stats small,
html[data-site-theme="dark"] .preview-event small,
html[data-site-theme="dark"] .preview-progress small{
  color:var(--muted);
}

html[data-site-theme="dark"] .progress-track{
  background:#413c35;
}


/* ---------------------------------------------------------
   ACCURATE DASHBOARD PREVIEW
--------------------------------------------------------- */

html[data-site-theme="dark"] .accurate-dashboard{
  background:
    radial-gradient(
      circle at 90% 3%,
      rgba(168,187,143,.09),
      transparent 30%
    ),
    linear-gradient(
      135deg,
      #24221f,
      #1b1a18
    );
}

html[data-site-theme="dark"] .accurate-dashboard-hero,
html[data-site-theme="dark"] .accurate-card{
  border-color:#4d4841;
  background:#292724;
  box-shadow:0 10px 24px rgba(0,0,0,.20);
}

html[data-site-theme="dark"] .accurate-dashboard-hero h3,
html[data-site-theme="dark"] .accurate-card-heading strong,
html[data-site-theme="dark"] .accurate-task strong,
html[data-site-theme="dark"] .accurate-grade span{
  color:var(--ink);
}

html[data-site-theme="dark"] .accurate-dashboard-hero p,
html[data-site-theme="dark"] .accurate-card-heading small,
html[data-site-theme="dark"] .accurate-task small{
  color:var(--muted);
}

html[data-site-theme="dark"] .accurate-dashboard-actions span{
  border-color:#514b43;
  color:var(--ink);
  background:#302d29;
}

html[data-site-theme="dark"] .accurate-task,
html[data-site-theme="dark"] .accurate-grade{
  border-color:#4d4841;
  background:#242321;
}

html[data-site-theme="dark"] .accurate-pill,
html[data-site-theme="dark"] .accurate-task>span{
  border-color:#514b43;
  color:#d7cabb;
  background:#39342e;
}

html[data-site-theme="dark"] .accurate-balance span{
  color:#ddd5c9;
}

html[data-site-theme="dark"] .accurate-balance b{
  color:#aaa196;
}

html[data-site-theme="dark"] .accurate-balance-track{
  background:#413c35;
}


/* ---------------------------------------------------------
   FEATURE CARDS
--------------------------------------------------------- */

html[data-site-theme="dark"] .feature-card,
html[data-site-theme="dark"] .mini-semester{
  border-color:var(--line);
  background:rgba(35,34,32,.90);
}

html[data-site-theme="dark"] .feature-number{
  color:#d8a15f;
  border-color:var(--line);
  background:#2b2926;
}


/* ---------------------------------------------------------
   PRICING
--------------------------------------------------------- */

html[data-site-theme="dark"] .pricing-card{
  border-color:var(--line);
  background:rgba(35,34,32,.94);
  box-shadow:0 30px 70px rgba(0,0,0,.25);
}

html[data-site-theme="dark"] .launch-badge{
  color:#e2b982;
  background:#3c3025;
}

html[data-site-theme="dark"] .regular-price,
html[data-site-theme="dark"] .price small,
html[data-site-theme="dark"] .price>span:last-child,
html[data-site-theme="dark"] .purchase-area small{
  color:var(--muted);
}

html[data-site-theme="dark"] .pricing-bottom li{
  color:#ddd5c9;
}

html[data-site-theme="dark"] .pricing-bottom li::before{
  color:#cfe5b8;
  background:#35402e;
}

html[data-site-theme="dark"] .guarantee{
  border-color:#4e5c45;
  background:rgba(54,67,47,.42);
}

html[data-site-theme="dark"] .guarantee p{
  color:#b8c8a9;
}


/* ---------------------------------------------------------
   REQUIREMENTS
--------------------------------------------------------- */

html[data-site-theme="dark"] .requirements-card,
html[data-site-theme="dark"] .requirements-list{
  border-color:var(--line);
  background:rgba(35,34,32,.86);
}

html[data-site-theme="dark"] .requirements-list small{
  color:var(--muted);
}


/* ---------------------------------------------------------
   FAQ
--------------------------------------------------------- */

html[data-site-theme="dark"] .faq-list details{
  border-color:var(--line);
  background:rgba(35,34,32,.90);
}

html[data-site-theme="dark"] .faq-list summary::after{
  color:#e1b17c;
  background:#302c27;
}


/* ---------------------------------------------------------
   TEXT ACCENTS
--------------------------------------------------------- */

html[data-site-theme="dark"] .eyebrow{
  color:#d8a15f;
}

html[data-site-theme="dark"] ::selection{
  background:rgba(216,161,95,.26);
}


/* ---------------------------------------------------------
   MOBILE
--------------------------------------------------------- */

@media(max-width:760px){

  .theme-toggle{
    width:40px;
    height:40px;
    flex-basis:40px;
  }

}


/* STDNTOS INTERACTIVE DEMO SHOWCASE V1
============================================================ */

.demo-showcase-section{
  padding-top:24px;
}

.demo-showcase-card{
  position:relative;
  overflow:hidden;

  display:grid;
  grid-template-columns:
    minmax(0,1.02fr)
    minmax(380px,.98fr);

  gap:46px;
  align-items:center;

  padding:clamp(32px,5vw,64px);

  border-radius:36px;

  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(143,162,123,.22),
      transparent 30%
    ),
    radial-gradient(
      circle at 8% 92%,
      rgba(201,142,114,.19),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      #3a2d24,
      #30251e
    );

  color:#fffaf2;

  box-shadow:
    0 30px 80px rgba(67,46,28,.18);
}

.demo-showcase-card::before{
  content:"";

  position:absolute;
  width:360px;
  height:360px;

  right:-180px;
  bottom:-210px;

  border-radius:50%;

  border:
    1px solid rgba(255,255,255,.08);
}

.demo-showcase-copy{
  position:relative;
  z-index:2;
}

.demo-showcase-eyebrow{
  color:#d9b986 !important;
}

.demo-showcase-copy h2{
  max-width:620px;

  margin:
    10px
    0
    18px;

  color:#fffaf2;

  font-size:
    clamp(34px,4.4vw,58px);

  line-height:1.02;

  letter-spacing:-.045em;
}

.demo-showcase-lead{
  max-width:610px;

  margin:0;

  color:rgba(255,250,242,.72);

  font-size:15px;
  line-height:1.75;
}


.demo-showcase-points{
  display:grid;
  gap:10px;

  margin-top:28px;
}

.demo-showcase-point{
  display:grid;

  grid-template-columns:
    40px
    minmax(0,1fr);

  gap:13px;

  align-items:start;

  padding:13px 14px;

  border:
    1px solid rgba(255,255,255,.09);

  border-radius:16px;

  background:
    rgba(255,255,255,.045);
}

.demo-showcase-point>span{
  width:34px;
  height:34px;

  display:grid;
  place-items:center;

  border-radius:11px;

  background:
    rgba(255,255,255,.09);

  color:#d9b986;

  font-size:9px;
  font-weight:950;
}

.demo-showcase-point strong{
  display:block;

  margin-bottom:3px;

  color:#fffaf2;

  font-size:13px;
}

.demo-showcase-point p{
  margin:0;

  color:rgba(255,250,242,.62);

  font-size:11px;
  line-height:1.5;
}


.demo-showcase-actions{
  display:flex;
  align-items:center;
  flex-wrap:wrap;

  gap:14px;

  margin-top:26px;
}

.demo-showcase-button{
  display:inline-flex;
  align-items:center;
  gap:10px;

  color:#31271f !important;

  background:#fffaf2 !important;

  border-color:#fffaf2 !important;

  box-shadow:
    0 13px 28px rgba(0,0,0,.16);
}

.demo-showcase-button:hover{
  transform:translateY(-2px);
}

.demo-showcase-button span{
  font-size:16px;
}

.demo-showcase-actions>span{
  color:rgba(255,250,242,.55);

  font-size:11px;
  font-weight:800;
}


/* ---------------------------------------------------------
   MINI APP WINDOW
--------------------------------------------------------- */

.demo-showcase-window{
  position:relative;
  z-index:2;

  overflow:hidden;

  min-width:0;

  border:
    1px solid rgba(255,255,255,.14);

  border-radius:24px;

  background:#f6eddf;

  box-shadow:
    0 30px 70px rgba(0,0,0,.28);

  transform:rotate(1deg);
}

.demo-window-top{
  min-height:42px;

  display:flex;
  align-items:center;

  gap:12px;

  padding:0 14px;

  border-bottom:
    1px solid rgba(49,39,31,.10);

  background:#fffaf2;

  color:#8d7a65;

  font-size:9px;
  font-weight:850;
}

.demo-window-dots{
  display:flex;
  gap:5px;
}

.demo-window-dots i{
  width:7px;
  height:7px;

  display:block;

  border-radius:50%;

  background:#c98e72;
}

.demo-window-dots i:nth-child(2){
  background:#d9b986;
}

.demo-window-dots i:nth-child(3){
  background:#8fa27b;
}


.demo-window-app{
  min-height:365px;

  display:grid;

  grid-template-columns:
    118px
    minmax(0,1fr);
}

.demo-window-sidebar{
  display:flex;
  flex-direction:column;

  padding:17px 11px;

  background:#3a2d24;
}

.demo-window-sidebar>strong{
  margin:
    2px
    7px
    17px;

  color:#fffaf2;

  font-size:14px;
}

.demo-window-nav{
  display:grid;
  gap:5px;
}

.demo-window-nav span{
  padding:7px 8px;

  border-radius:9px;

  color:
    rgba(255,250,242,.56);

  font-size:7px;
  font-weight:800;
}

.demo-window-nav span.active{
  color:#fffaf2;

  background:
    rgba(255,255,255,.12);
}


.demo-window-main{
  min-width:0;

  padding:18px;

  background:#f6eddf;
}

.demo-window-heading{
  display:grid;
  gap:5px;

  margin-bottom:15px;
}

.demo-window-heading small,
.demo-window-panel>small{
  color:#b77a52;

  font-size:7px;
  font-weight:950;

  letter-spacing:.11em;
}

.demo-window-heading strong{
  color:#31271f;

  font-size:18px;
  line-height:1.05;
}


.demo-window-grid{
  display:grid;

  grid-template-columns:
    minmax(0,1.15fr)
    minmax(120px,.85fr);

  gap:10px;
}

.demo-window-panel{
  min-width:0;

  padding:12px;

  border:1px solid #e3d4bd;

  border-radius:14px;

  background:#fffaf2;
}

.demo-window-task{
  display:grid;
  gap:3px;

  margin-top:8px;
  padding:9px;

  border-radius:10px;

  background:#f3e6d5;
}

.demo-window-task b{
  color:#31271f;

  font-size:8px;
}

.demo-window-task span{
  color:#8d7a65;

  font-size:6px;
}

.demo-window-grade{
  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:7px;

  margin-top:8px;
  padding:8px;

  border-radius:9px;

  background:#f3e6d5;
}

.demo-window-grade span{
  overflow:hidden;

  color:#6f6050;

  font-size:6px;

  text-overflow:ellipsis;
  white-space:nowrap;
}

.demo-window-grade b{
  color:#31271f;

  font-size:8px;
}


/* ---------------------------------------------------------
   WEBSITE DARK MODE
--------------------------------------------------------- */

html[data-site-theme="dark"]
.demo-showcase-card{
  background:
    radial-gradient(
      circle at 92% 8%,
      rgba(168,187,143,.14),
      transparent 30%
    ),
    radial-gradient(
      circle at 8% 92%,
      rgba(197,143,112,.12),
      transparent 32%
    ),
    linear-gradient(
      145deg,
      #24221f,
      #181817
    );

  border:
    1px solid #49443d;

  box-shadow:
    0 30px 80px rgba(0,0,0,.30);
}

html[data-site-theme="dark"]
.demo-showcase-window{
  border-color:#565048;

  background:#1c1b19;

  box-shadow:
    0 30px 70px rgba(0,0,0,.42);
}

html[data-site-theme="dark"]
.demo-window-top{
  border-color:#49443d;

  background:#292724;

  color:#c7beb0;
}

html[data-site-theme="dark"]
.demo-window-sidebar{
  background:#0f0f0f;
}

html[data-site-theme="dark"]
.demo-window-main{
  background:#1c1b19;
}

html[data-site-theme="dark"]
.demo-window-heading strong{
  color:#f5f1e8;
}

html[data-site-theme="dark"]
.demo-window-panel{
  border-color:#49443d;

  background:#292724;
}

html[data-site-theme="dark"]
.demo-window-task,
html[data-site-theme="dark"]
.demo-window-grade{
  background:#34312d;
}

html[data-site-theme="dark"]
.demo-window-task b,
html[data-site-theme="dark"]
.demo-window-grade b{
  color:#f5f1e8;
}

html[data-site-theme="dark"]
.demo-window-task span,
html[data-site-theme="dark"]
.demo-window-grade span{
  color:#c7beb0;
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media(max-width:980px){

  .demo-showcase-card{
    grid-template-columns:1fr;

    gap:34px;
  }

  .demo-showcase-window{
    width:min(620px,100%);

    margin-inline:auto;

    transform:none;
  }

}


@media(max-width:620px){

  .demo-showcase-card{
    padding:28px 20px;

    border-radius:26px;
  }

  .demo-showcase-copy h2{
    font-size:34px;
  }

  .demo-showcase-window{
    border-radius:18px;
  }

  .demo-window-app{
    grid-template-columns:
      78px
      minmax(0,1fr);

    min-height:310px;
  }

  .demo-window-sidebar{
    padding:
      14px
      6px;
  }

  .demo-window-sidebar>strong{
    margin:
      2px
      4px
      13px;

    font-size:10px;
  }

  .demo-window-nav span{
    padding:
      6px
      5px;

    font-size:5.5px;
  }

  .demo-window-main{
    padding:12px;
  }

  .demo-window-heading strong{
    font-size:14px;
  }

  .demo-window-grid{
    grid-template-columns:1fr;
  }

  .demo-window-panel:not(.large){
    display:none;
  }

}


/* STDNTOS SUPPORT PAGE V1
============================================================ */

.support-main{
  overflow:hidden;
}


/* ---------------------------------------------------------
   HERO
--------------------------------------------------------- */

.support-hero{
  position:relative;

  padding:
    clamp(150px,18vw,205px)
    0
    clamp(72px,9vw,110px);
}

.support-hero::before{
  content:"";

  position:absolute;

  width:520px;
  height:520px;

  top:-180px;
  left:50%;

  transform:translateX(-50%);

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(201,142,114,.16),
      transparent 68%
    );

  pointer-events:none;
}

.support-hero-copy{
  position:relative;

  max-width:760px;

  margin-inline:auto;

  text-align:center;
}

.support-hero h1{
  margin:
    10px
    0
    18px;

  color:var(--ink);

  font-size:
    clamp(46px,7vw,78px);

  line-height:.98;

  letter-spacing:-.055em;
}

.support-hero-copy>p{
  max-width:650px;

  margin-inline:auto;

  color:var(--muted);

  font-size:16px;
  line-height:1.75;
}

.support-hero-actions{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;

  gap:10px;

  margin-top:28px;
}


/* ---------------------------------------------------------
   QUICK TOPICS
--------------------------------------------------------- */

.support-quick-section{
  padding-top:28px;
}

.support-topic-grid{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:14px;

  margin-top:36px;
}

.support-topic-card{
  display:grid;

  grid-template-columns:
    44px
    minmax(0,1fr)
    auto;

  gap:15px;
  align-items:center;

  padding:22px;

  border:1px solid var(--line);
  border-radius:22px;

  background:var(--paper);

  color:var(--ink);

  text-decoration:none;

  box-shadow:
    0 12px 32px rgba(67,46,28,.06);

  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease;
}

.support-topic-card:hover{
  transform:translateY(-3px);

  border-color:
    color-mix(
      in srgb,
      var(--brand) 45%,
      var(--line)
    );

  box-shadow:
    0 18px 42px rgba(67,46,28,.10);
}

.support-topic-number{
  width:42px;
  height:42px;

  display:grid;
  place-items:center;

  border-radius:13px;

  color:var(--brand);

  background:
    color-mix(
      in srgb,
      var(--brand) 10%,
      var(--paper)
    );

  font-size:10px;
  font-weight:950;
}

.support-topic-card h3{
  margin:0 0 5px;

  font-size:16px;
}

.support-topic-card p{
  margin:0;

  color:var(--muted);

  font-size:11px;
  line-height:1.55;
}

.support-topic-arrow{
  color:var(--brand);

  font-size:19px;
}


/* ---------------------------------------------------------
   GENERAL CONTENT
--------------------------------------------------------- */

.support-content-layout{
  display:grid;

  grid-template-columns:
    minmax(0,.8fr)
    minmax(0,1.2fr);

  gap:70px;
  align-items:start;
}

.support-section-intro{
  position:sticky;

  top:125px;
}

.support-section-intro h2{
  margin:
    10px
    0
    15px;

  font-size:
    clamp(32px,4vw,48px);

  line-height:1.06;

  letter-spacing:-.04em;
}

.support-section-intro>p{
  color:var(--muted);

  line-height:1.7;
}


/* ---------------------------------------------------------
   GETTING STARTED STEPS
--------------------------------------------------------- */

.support-step-list{
  display:grid;
  gap:12px;
}

.support-step{
  display:grid;

  grid-template-columns:
    48px
    minmax(0,1fr);

  gap:16px;

  padding:22px;

  border:1px solid var(--line);
  border-radius:20px;

  background:var(--paper);
}

.support-step>span{
  width:44px;
  height:44px;

  display:grid;
  place-items:center;

  border-radius:14px;

  background:
    linear-gradient(
      135deg,
      var(--brand),
      var(--clay)
    );

  color:#fff;

  font-size:12px;
  font-weight:950;
}

.support-step h3{
  margin:2px 0 7px;

  font-size:17px;
}

.support-step p{
  margin:0;

  color:var(--muted);

  font-size:12px;
  line-height:1.65;
}


/* ---------------------------------------------------------
   SOFT SECTIONS
--------------------------------------------------------- */

.support-soft-section{
  background:
    color-mix(
      in srgb,
      var(--paper) 50%,
      transparent
    );

  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}


/* ---------------------------------------------------------
   INSTALLATION
--------------------------------------------------------- */

.support-info-card{
  display:grid;

  grid-template-columns:
    minmax(0,.88fr)
    minmax(0,1.12fr);

  gap:48px;
  align-items:center;

  padding:
    clamp(28px,5vw,52px);

  border:1px solid var(--line);
  border-radius:30px;

  background:var(--paper);

  box-shadow:
    0 20px 60px rgba(67,46,28,.07);
}

.support-info-copy h2{
  margin:
    10px
    0
    16px;

  font-size:
    clamp(32px,4vw,48px);

  line-height:1.06;

  letter-spacing:-.04em;
}

.support-info-copy>p{
  color:var(--muted);

  line-height:1.7;
}

.support-install-steps{
  display:grid;
  gap:9px;
}

.support-install-steps>div{
  display:grid;

  grid-template-columns:
    42px
    minmax(0,1fr);

  gap:12px;
  align-items:center;

  padding:13px;

  border-radius:15px;

  background:var(--paper2);
}

.support-install-steps strong{
  color:var(--brand);

  font-size:10px;
}

.support-install-steps span{
  color:var(--ink-soft);

  font-size:11px;
  line-height:1.5;
}

.support-requirements{
  display:grid;

  grid-template-columns:
    repeat(4,minmax(0,1fr));

  gap:10px;

  margin-top:16px;
}

.support-requirements>div{
  padding:17px;

  border:1px solid var(--line);
  border-radius:16px;

  background:var(--paper);
}

.support-requirements small{
  display:block;

  margin-bottom:5px;

  color:var(--muted);

  font-size:9px;
  font-weight:800;

  text-transform:uppercase;
  letter-spacing:.08em;
}

.support-requirements strong{
  display:block;

  font-size:12px;
  line-height:1.4;
}


/* ---------------------------------------------------------
   FEATURE HELP
--------------------------------------------------------- */

.support-feature-grid{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:13px;

  margin-top:34px;
}

.support-feature-card{
  padding:22px;

  border:1px solid var(--line);
  border-radius:20px;

  background:var(--paper);
}

.support-feature-card>span{
  display:inline-flex;

  padding:6px 9px;

  border-radius:999px;

  color:var(--brand);

  background:
    color-mix(
      in srgb,
      var(--brand) 10%,
      var(--paper)
    );

  font-size:9px;
  font-weight:900;
}

.support-feature-card h3{
  margin:
    17px
    0
    8px;

  font-size:17px;
  line-height:1.25;
}

.support-feature-card p{
  margin:0;

  color:var(--muted);

  font-size:11px;
  line-height:1.6;
}


/* ---------------------------------------------------------
   FAQ
--------------------------------------------------------- */

.support-faq-list{
  display:grid;

  gap:10px;

  margin-top:34px;
}

.support-faq-list details{
  overflow:hidden;

  border:1px solid var(--line);
  border-radius:18px;

  background:var(--paper);
}

.support-faq-list summary{
  position:relative;

  padding:
    19px
    54px
    19px
    20px;

  color:var(--ink);

  font-size:13px;
  font-weight:850;

  cursor:pointer;

  list-style:none;
}

.support-faq-list summary::-webkit-details-marker{
  display:none;
}

.support-faq-list summary::after{
  content:"+";

  position:absolute;

  right:18px;
  top:50%;

  width:28px;
  height:28px;

  display:grid;
  place-items:center;

  transform:translateY(-50%);

  border-radius:9px;

  color:var(--brand);

  background:var(--paper2);

  font-size:16px;
}

.support-faq-list details[open]
summary::after{
  content:"−";
}

.support-faq-list details>div{
  padding:
    0
    20px
    20px;
}

.support-faq-list details p{
  margin:
    0
    0
    10px;

  color:var(--muted);

  font-size:12px;
  line-height:1.65;
}

.support-inline-link{
  color:var(--brand);

  font-size:12px;
  font-weight:850;

  text-decoration:none;
}


/* ---------------------------------------------------------
   CONTACT
--------------------------------------------------------- */

.support-contact-card{
  display:flex;

  align-items:center;
  justify-content:space-between;

  gap:40px;

  padding:
    clamp(30px,5vw,54px);

  border-radius:30px;

  color:#fffaf2;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(143,162,123,.25),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #3a2d24,
      #30251e
    );
}

.support-contact-card h2{
  max-width:620px;

  margin:
    10px
    0
    13px;

  color:#fffaf2;

  font-size:
    clamp(30px,4vw,46px);

  line-height:1.06;

  letter-spacing:-.04em;
}

.support-contact-card p{
  max-width:650px;

  margin:0;

  color:rgba(255,250,242,.66);

  font-size:12px;
  line-height:1.7;
}

.support-contact-card .eyebrow{
  color:#d9b986;
}

.support-contact-actions{
  flex:0 0 auto;

  display:grid;

  gap:9px;

  min-width:190px;
}

.support-contact-actions
.button-primary{
  background:#fffaf2;
  border-color:#fffaf2;
  color:#31271f;
}

.support-contact-actions
.button-secondary{
  border-color:
    rgba(255,255,255,.18);

  background:
    rgba(255,255,255,.06);

  color:#fffaf2;
}


/* ---------------------------------------------------------
   DARK MODE
--------------------------------------------------------- */

html[data-site-theme="dark"]
.support-topic-card,

html[data-site-theme="dark"]
.support-step,

html[data-site-theme="dark"]
.support-info-card,

html[data-site-theme="dark"]
.support-requirements>div,

html[data-site-theme="dark"]
.support-feature-card,

html[data-site-theme="dark"]
.support-faq-list details{
  box-shadow:none;
}

html[data-site-theme="dark"]
.support-contact-card{
  border:1px solid #49443d;

  background:
    radial-gradient(
      circle at 100% 0%,
      rgba(168,187,143,.12),
      transparent 34%
    ),
    linear-gradient(
      145deg,
      #24221f,
      #181817
    );
}


/* ---------------------------------------------------------
   RESPONSIVE
--------------------------------------------------------- */

@media(max-width:900px){

  .support-content-layout{
    grid-template-columns:1fr;

    gap:32px;
  }

  .support-section-intro{
    position:static;
  }

  .support-info-card{
    grid-template-columns:1fr;
  }

  .support-feature-grid{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .support-requirements{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

  .support-contact-card{
    align-items:flex-start;
    flex-direction:column;
  }

  .support-contact-actions{
    width:100%;

    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:680px){

  .support-hero{
    padding-top:135px;
  }

  .support-topic-grid{
    grid-template-columns:1fr;
  }

  .support-feature-grid{
    grid-template-columns:1fr;
  }

  .support-requirements{
    grid-template-columns:1fr;
  }

  .support-contact-actions{
    grid-template-columns:1fr;
  }

  .support-step{
    grid-template-columns:
      42px
      minmax(0,1fr);

    padding:17px;
  }

  .support-step>span{
    width:38px;
    height:38px;
  }

}


/* STDNTOS LEGAL PAGES V1
   Reused by Privacy, Terms and Refund Policy
============================================================ */

.legal-main{
  overflow:hidden;
}


/* HERO */

.legal-hero{
  position:relative;

  padding:
    clamp(150px,18vw,205px)
    0
    72px;
}

.legal-hero::before{
  content:"";

  position:absolute;

  width:520px;
  height:520px;

  left:50%;
  top:-200px;

  transform:translateX(-50%);

  border-radius:50%;

  background:
    radial-gradient(
      circle,
      rgba(143,162,123,.15),
      transparent 68%
    );

  pointer-events:none;
}

.legal-hero-copy{
  position:relative;

  max-width:760px;

  margin-inline:auto;

  text-align:center;
}

.legal-hero h1{
  margin:
    10px
    0
    18px;

  font-size:
    clamp(46px,7vw,76px);

  line-height:.98;

  letter-spacing:-.055em;
}

.legal-hero-copy>p{
  max-width:650px;

  margin-inline:auto;

  color:var(--muted);

  font-size:15px;
  line-height:1.75;
}

.legal-meta{
  display:inline-flex;

  align-items:center;

  gap:8px;

  margin-top:20px;
  padding:8px 12px;

  border:1px solid var(--line);
  border-radius:999px;

  background:var(--paper);
}

.legal-meta span{
  color:var(--muted);

  font-size:9px;
  font-weight:800;

  text-transform:uppercase;
  letter-spacing:.08em;
}

.legal-meta strong{
  font-size:10px;
}


/* LAYOUT */

.legal-content-section{
  padding-top:34px;
}

.legal-layout{
  display:grid;

  grid-template-columns:
    230px
    minmax(0,760px);

  justify-content:center;

  gap:54px;

  align-items:start;
}


/* SIDEBAR */

.legal-sidebar{
  position:sticky;

  top:118px;
}

.legal-sidebar-card{
  padding:18px;

  border:1px solid var(--line);
  border-radius:20px;

  background:var(--paper);
}

.legal-sidebar-title{
  display:block;

  margin:
    2px
    9px
    11px;

  color:var(--muted);

  font-size:9px;
  font-weight:950;

  letter-spacing:.1em;
  text-transform:uppercase;
}

.legal-sidebar nav{
  display:grid;
  gap:3px;
}

.legal-sidebar a{
  padding:8px 9px;

  border-radius:9px;

  color:var(--muted);

  font-size:10px;
  font-weight:750;

  line-height:1.35;

  text-decoration:none;
}

.legal-sidebar a:hover{
  color:var(--ink);

  background:var(--paper2);
}


/* DOCUMENT */

.legal-document{
  min-width:0;
}

.legal-notice{
  margin-bottom:14px;

  padding:20px;

  border:
    1px solid
    color-mix(
      in srgb,
      var(--sage) 42%,
      var(--line)
    );

  border-radius:18px;

  background:
    color-mix(
      in srgb,
      var(--sage) 10%,
      var(--paper)
    );
}

.legal-notice strong{
  display:block;

  margin-bottom:6px;

  color:
    color-mix(
      in srgb,
      var(--sage) 68%,
      var(--ink)
    );

  font-size:12px;
}

.legal-notice p{
  margin:0;

  color:var(--muted);

  font-size:11px;
  line-height:1.6;
}


.legal-section{
  scroll-margin-top:125px;

  padding:
    31px
    0;

  border-bottom:1px solid var(--line);
}

.legal-section:last-child{
  border-bottom:0;
}

.legal-section-number{
  display:inline-flex;

  margin-bottom:11px;

  color:var(--brand);

  font-size:9px;
  font-weight:950;

  letter-spacing:.12em;
}

.legal-section h2{
  margin:
    0
    0
    16px;

  font-size:
    clamp(25px,3vw,34px);

  line-height:1.1;

  letter-spacing:-.035em;
}

.legal-section h3{
  margin:
    24px
    0
    8px;

  font-size:15px;
}

.legal-section p{
  margin:
    0
    0
    14px;

  color:var(--muted);

  font-size:12px;
  line-height:1.75;
}

.legal-section ul{
  display:grid;
  gap:8px;

  margin:
    5px
    0
    18px;

  padding-left:20px;

  color:var(--muted);
}

.legal-section li{
  padding-left:3px;

  font-size:12px;
  line-height:1.6;
}

.legal-section li::marker{
  color:var(--brand);
}


/* CALLOUT */

.legal-callout{
  margin:
    20px
    0
    5px;

  padding:19px;

  border-left:4px solid var(--brand);
  border-radius:0 16px 16px 0;

  background:
    color-mix(
      in srgb,
      var(--brand) 8%,
      var(--paper)
    );
}

.legal-callout strong{
  display:block;

  margin-bottom:5px;

  font-size:12px;
}

.legal-callout p{
  margin:0;
}


/* DATA GRID */

.legal-data-grid{
  display:grid;

  grid-template-columns:
    repeat(3,minmax(0,1fr));

  gap:9px;

  margin:
    19px
    0;
}

.legal-data-grid>div{
  padding:16px;

  border:1px solid var(--line);
  border-radius:15px;

  background:var(--paper);
}

.legal-data-grid strong{
  display:block;

  margin-bottom:6px;

  font-size:11px;
}

.legal-data-grid span{
  display:block;

  color:var(--muted);

  font-size:10px;
  line-height:1.5;
}


/* CONTACT */

.legal-contact-actions{
  display:flex;
  flex-wrap:wrap;

  gap:9px;

  margin-top:22px;
}


/* DARK MODE */

html[data-site-theme="dark"]
.legal-sidebar-card,

html[data-site-theme="dark"]
.legal-meta,

html[data-site-theme="dark"]
.legal-data-grid>div{
  box-shadow:none;
}


/* RESPONSIVE */

@media(max-width:900px){

  .legal-layout{
    grid-template-columns:1fr;

    max-width:760px;
  }

  .legal-sidebar{
    position:static;
  }

  .legal-sidebar-card nav{
    grid-template-columns:
      repeat(2,minmax(0,1fr));
  }

}


@media(max-width:680px){

  .legal-hero{
    padding-top:135px;
  }

  .legal-sidebar-card nav{
    grid-template-columns:1fr;
  }

  .legal-data-grid{
    grid-template-columns:1fr;
  }

}

/* ==========================================================
   STDNTOS PURCHASE SUCCESS PAGE V1
   ========================================================== */

.purchase-success-main {
  min-height: 100vh;
  overflow: hidden;
}

.purchase-success-hero {
  padding: 92px 0 48px;
  position: relative;
}

.purchase-success-hero::before {
  content: "";
  position: absolute;
  width: 460px;
  height: 460px;
  border-radius: 50%;
  background:
    radial-gradient(
      circle,
      rgba(196, 143, 112, 0.15) 0%,
      rgba(196, 143, 112, 0) 70%
    );
  top: -180px;
  right: -110px;
  pointer-events: none;
}

.purchase-success-card {
  position: relative;
  text-align: center;
  max-width: 760px;
  margin: 0 auto;
  padding: 56px 54px;
  background: var(--paper, #fffaf3);
  border: 1px solid rgba(120, 100, 80, 0.16);
  border-radius: 30px;
  box-shadow:
    0 24px 70px rgba(66, 47, 32, 0.09);
}

.purchase-success-check {
  width: 76px;
  height: 76px;
  margin: 0 auto 24px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background:
    linear-gradient(
      135deg,
      var(--sage, #a8bb8f),
      #829c72
    );
  color: #ffffff;
  font-size: 34px;
  font-weight: 800;
  box-shadow:
    0 12px 28px rgba(105, 132, 87, 0.22);
}

.purchase-success-card h1 {
  max-width: 650px;
  margin: 14px auto 18px;
  font-size: clamp(2.35rem, 6vw, 4.15rem);
  line-height: 0.98;
  letter-spacing: -0.055em;
}

.purchase-success-card h1 span {
  display: block;
  color: var(--brand, #b97854);
}

.purchase-success-lead {
  max-width: 610px;
  margin: 0 auto;
  font-size: 1.08rem;
  line-height: 1.75;
  color: var(--muted, #71675d);
}

.purchase-success-note {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  text-align: left;
  max-width: 590px;
  margin: 34px auto 0;
  padding: 20px 22px;
  border-radius: 18px;
  background: rgba(168, 187, 143, 0.12);
  border: 1px solid rgba(130, 156, 114, 0.20);
}

.purchase-success-note-icon {
  flex: 0 0 auto;
  width: 42px;
  height: 42px;
  display: grid;
  place-items: center;
  border-radius: 13px;
  background: rgba(130, 156, 114, 0.15);
  font-size: 19px;
}

.purchase-success-note strong {
  display: block;
  margin-bottom: 5px;
}

.purchase-success-note p {
  margin: 0;
  color: var(--muted, #71675d);
  line-height: 1.55;
}

.purchase-success-section {
  padding-top: 58px;
}

.purchase-steps {
  max-width: 820px;
  margin: 42px auto 0;
  display: grid;
  gap: 14px;
}

.purchase-step {
  display: grid;
  grid-template-columns: 74px 1fr;
  gap: 22px;
  align-items: start;
  padding: 26px 28px;
  background: var(--paper, #fffaf3);
  border: 1px solid rgba(120, 100, 80, 0.14);
  border-radius: 22px;
}

.purchase-step-number {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  color: var(--brand, #b97854);
  padding-top: 4px;
}

.purchase-step h3 {
  margin: 0 0 7px;
  font-size: 1.08rem;
}

.purchase-step p {
  margin: 0;
  line-height: 1.65;
  color: var(--muted, #71675d);
}

.purchase-step .purchase-step-small {
  margin-top: 9px;
  font-size: 0.9rem;
  opacity: 0.85;
}

.purchase-info-section {
  padding-top: 36px;
}

.purchase-info-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
}

.purchase-info-card {
  padding: 28px;
  background: var(--paper, #fffaf3);
  border: 1px solid rgba(120, 100, 80, 0.14);
  border-radius: 22px;
}

.purchase-info-icon {
  width: 44px;
  height: 44px;
  display: grid;
  place-items: center;
  margin-bottom: 18px;
  border-radius: 14px;
  background: rgba(196, 143, 112, 0.12);
  color: var(--brand, #b97854);
  font-weight: 800;
  font-size: 1.1rem;
}

.purchase-info-card h3 {
  margin: 0 0 9px;
  font-size: 1.05rem;
}

.purchase-info-card p {
  margin: 0;
  color: var(--muted, #71675d);
  line-height: 1.6;
  font-size: 0.94rem;
}

.purchase-info-card a {
  display: inline-block;
  margin-top: 15px;
  font-weight: 700;
  color: var(--brand, #b97854);
  text-decoration: none;
}

.purchase-help-section {
  padding-top: 38px;
}

.purchase-help-card {
  display: flex;
  justify-content: space-between;
  gap: 40px;
  align-items: center;
  padding: 38px 42px;
  border-radius: 26px;
  background:
    linear-gradient(
      135deg,
      rgba(196, 143, 112, 0.13),
      rgba(168, 187, 143, 0.12)
    );
  border: 1px solid rgba(120, 100, 80, 0.13);
}

.purchase-help-card h2 {
  margin: 7px 0 10px;
}

.purchase-help-card p {
  max-width: 550px;
  margin: 0;
  line-height: 1.65;
  color: var(--muted, #71675d);
}

.purchase-help-actions {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  gap: 10px;
  min-width: 160px;
}

.purchase-help-actions .button {
  text-align: center;
}

.purchase-closing {
  padding: 74px 0 92px;
}

.purchase-closing-inner {
  text-align: center;
}

.purchase-closing-mark {
  margin: 0 auto 20px;
}

.purchase-closing-inner h2 {
  margin: 0 0 8px;
  font-size: clamp(1.6rem, 4vw, 2.4rem);
}

.purchase-closing-inner p {
  margin: 0;
  color: var(--muted, #71675d);
}


/* Dark mode */

html[data-site-theme="dark"] .purchase-success-card,
html[data-site-theme="dark"] .purchase-step,
html[data-site-theme="dark"] .purchase-info-card {
  border-color: rgba(255, 255, 255, 0.08);
}

html[data-site-theme="dark"] .purchase-success-card {
  box-shadow:
    0 24px 70px rgba(0, 0, 0, 0.25);
}

html[data-site-theme="dark"] .purchase-success-note {
  background: rgba(168, 187, 143, 0.09);
  border-color: rgba(168, 187, 143, 0.16);
}

html[data-site-theme="dark"] .purchase-help-card {
  border-color: rgba(255, 255, 255, 0.08);
}


/* Responsive */

@media (max-width: 820px) {

  .purchase-success-hero {
    padding-top: 64px;
  }

  .purchase-success-card {
    padding: 44px 28px;
  }

  .purchase-info-grid {
    grid-template-columns: 1fr;
  }

  .purchase-help-card {
    flex-direction: column;
    align-items: stretch;
  }

  .purchase-help-actions {
    flex-direction: row;
  }

  .purchase-help-actions .button {
    flex: 1;
  }
}


@media (max-width: 560px) {

  .purchase-success-card {
    padding: 38px 20px;
    border-radius: 24px;
  }

  .purchase-success-check {
    width: 66px;
    height: 66px;
    font-size: 29px;
  }

  .purchase-success-note {
    padding: 18px;
  }

  .purchase-step {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 23px 21px;
  }

  .purchase-step-number {
    padding: 0;
  }

  .purchase-help-card {
    padding: 30px 24px;
  }

  .purchase-help-actions {
    flex-direction: column;
  }
}
