:root{--ink:#17233d;--muted:#667085;--line:#dbe2ee;--soft:#f5f7fb;--mint:#dfe8ff;--accent:#3157d5;--signal:#00a3a3}
body{background:#fff;color:var(--ink);font-family:"Segoe UI Variable Text","Segoe UI",Arial,sans-serif}
h1,h2,h3{font-family:"Segoe UI Variable Display","Segoe UI",Arial,sans-serif;font-weight:780;letter-spacing:-.045em}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(49,87,213,.24);outline-offset:2px}
.container{max-width:1240px}
.site-header{background:rgba(255,255,255,.96);border-bottom-color:#e5e9f2;backdrop-filter:blur(16px)}
.nav-shell{height:72px}
.brand{gap:12px;color:var(--ink);font-size:.78rem;letter-spacing:.17em}
.brand-mark{width:40px;height:40px;border-radius:11px;background:var(--accent);font-family:"Segoe UI",Arial,sans-serif;font-size:.78rem;box-shadow:0 8px 18px rgba(49,87,213,.2)}
.nav-links a,.nav-button{font-weight:600}
.nav-links a:hover,.nav-button:hover{color:var(--accent)}
.eyebrow{color:var(--accent);font-size:.7rem;letter-spacing:.2em}
.hero{position:relative;overflow:hidden;padding:88px 0 78px;background:#fff}
.hero:before{content:"";position:absolute;inset:0 0 0 57%;background-color:#f4f7ff;background-image:linear-gradient(rgba(49,87,213,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(49,87,213,.07) 1px,transparent 1px);background-size:30px 30px;border-left:1px solid #e1e8f7;transform:skewX(-7deg);transform-origin:top}
.hero-grid{position:relative;grid-template-columns:minmax(0,1.2fr) minmax(340px,.7fr);gap:8vw}
.hero h1{max-width:770px;margin:16px 0 22px;font-size:clamp(3.4rem,6.2vw,6rem);line-height:.94}
.hero-copy{max-width:690px;color:var(--muted);font-size:1.1rem;line-height:1.75}
.btn{border-radius:10px}
.btn-dark{background:var(--accent);border-color:var(--accent);box-shadow:0 8px 20px rgba(49,87,213,.18)}
.btn-dark:hover,.btn-dark:focus{background:#2447bd;border-color:#2447bd}
.btn-outline-dark{border-color:#aeb9cc;color:var(--ink)}
.process-card{position:relative;padding:32px;border:1px solid #d9e1f0;border-radius:18px;background:#fff;box-shadow:0 28px 70px rgba(34,54,93,.12)}
.process-card:before{content:"";position:absolute;top:-1px;right:28px;left:28px;height:4px;border-radius:0 0 5px 5px;background:linear-gradient(90deg,var(--accent),var(--signal))}
.process-card li{border-top-color:#e6eaf2}
.process-card li>span{width:28px;color:var(--accent);font-size:.72rem;font-weight:800}
.process-card small{margin-top:4px;color:var(--muted)}
.section{padding-top:78px;padding-bottom:82px}
.section-heading{align-items:center;margin-bottom:32px}
.section-heading h1,.section-heading h2{margin:7px 0;font-size:clamp(2.1rem,4vw,3.5rem)}
.topic-grid{gap:18px}
.topic-card{position:relative;min-height:315px;padding:28px;border:1px solid #dce3ef;border-radius:14px;background:#fff;box-shadow:0 8px 24px rgba(30,48,82,.04)}
.topic-card:before{content:"";position:absolute;top:0;right:0;left:0;height:4px;border-radius:14px 14px 0 0;background:linear-gradient(90deg,var(--accent),var(--signal))}
.topic-card:hover{border-color:#b9c8ed;box-shadow:0 18px 42px rgba(37,61,111,.11)}
.topic-card h3{font-size:1.55rem}
.topic-meta{color:#758096;font-weight:700;letter-spacing:.05em}
.choice-preview span{border:1px solid #e0e6f1;border-radius:6px;background:#f7f9fc;color:#536078}
.topic-card>a{color:var(--accent)}
.principle{background:#17233d}
.principle .eyebrow{color:#73d7d2}
.principle p:last-child{color:#cbd3e3}
.topic-layout{gap:8vw}
.interest-card{border:1px solid #d9e1ef;border-radius:18px;box-shadow:0 24px 60px rgba(30,48,82,.12)}
.notice{border-left-color:var(--accent);border-radius:0 10px 10px 0;background:#f3f6ff}
.form-control,.form-select{border-color:#cbd4e2;border-radius:9px}
.form-control:focus,.form-select:focus{border-color:#7e98e3;box-shadow:0 0 0 .2rem rgba(49,87,213,.12)}
.contact-options label{border-color:#dbe2ee;border-radius:8px}
.success-icon{background:var(--mint);color:var(--accent)}
.table-shell{border-color:#dce3ef;border-radius:12px}
.table th{background:#f5f7fb;color:#536078}
.status.ready{background:#dff5f2;color:#087f7a}
.status.growing{background:#fff2d9;color:#885d08}
.admin-form{border-color:#dce3ef;border-radius:16px;box-shadow:0 18px 50px rgba(30,48,82,.08)}
.stats div,.stats>.stat-link{border-color:#dce3ef;border-radius:12px;background:#fff}
footer{border-top-color:#e2e7f0;background:#f6f8fc}
.privacy-hero{background:linear-gradient(120deg,#fff 65%,#f1f5ff 65%)!important}
.privacy-summary{border-radius:14px;background:#f4f7ff}
.payment-choice-card,.gateway-card{border-color:#dce3ef!important;border-radius:16px!important;box-shadow:0 18px 50px rgba(30,48,82,.08)!important}
.identity-shell{background:linear-gradient(135deg,#fff 58%,#f2f6ff 58%)!important}
.identity-card{border-color:#d9e1ef!important;border-radius:18px!important;box-shadow:0 24px 65px rgba(30,48,82,.12)!important}
.app-loader-card{border-radius:18px}
.loader-brand-mark{border-radius:11px;background:var(--accent);font-family:"Segoe UI",Arial,sans-serif}
.app-loader-ring i{background:var(--signal)}

@media(max-width:900px){
  .hero{padding:62px 0 54px}
  .hero:before{inset:52% 0 0;background-size:24px 24px;border-top:1px solid #e1e8f7;border-left:0;transform:none}
  .hero-grid{grid-template-columns:1fr;gap:38px}
  .hero h1{font-size:clamp(3rem,10vw,4.8rem)}
  .process-card{max-width:620px}
}

@media(max-width:700px){
  .nav-shell{height:64px}
  .brand-mark{width:34px;height:34px;border-radius:9px;font-size:.68rem}
  .brand{gap:9px;font-size:.66rem;letter-spacing:.14em}
  .hero{padding:42px 16px 44px}
  .hero:before{inset:56% 0 0}
  .hero h1{font-size:clamp(2.7rem,13vw,3.6rem);line-height:.96}
  .hero-copy{font-size:.95rem;line-height:1.65}
  .process-card{padding:24px;border-radius:14px}
  .section{padding:48px 14px}
  .topic-card{min-height:0;padding:23px;border-radius:12px}
  .topic-card h3{margin:25px 0 10px}
  .principle{padding:52px 18px}
  .interest-card{padding:24px 20px;border-radius:14px}
  .privacy-hero{background:linear-gradient(145deg,#fff 76%,#f1f5ff 76%)!important}
  .admin-mobile-nav,.public-mobile-nav{border-top-color:#dce3ef;box-shadow:0 -8px 24px rgba(30,48,82,.11)}
  .admin-mobile-primary .admin-nav-icon{border-radius:12px;background:var(--accent);box-shadow:0 7px 18px rgba(49,87,213,.3)}
  .admin-mobile-nav a:hover,.admin-mobile-nav a:focus,.public-mobile-nav a:hover,.public-mobile-nav a:focus{color:var(--accent)}
}
