:root { --compass-navy: #153653; --compass-gold: #c7a35a; --compass-cream: #faf8f3; --compass-champagne: #e5d29a; }
.compass-landing { color: var(--compass-navy); background: var(--compass-cream); }
.compass-landing h1, .compass-landing h2, .compass-landing h3 { color: var(--compass-navy); }
.compass-hero { position: relative; overflow: hidden; background: radial-gradient(circle at 78% 48%, rgba(229,210,154,.34), transparent 27%), #f8f6f0; }
.compass-hero::after { content:""; position:absolute; width:min(620px,50vw); aspect-ratio:1; right:-8%; top:4%; border:1px solid rgba(199,163,90,.25); border-radius:50%; box-shadow:0 0 0 65px rgba(229,210,154,.12),0 0 0 130px rgba(141,177,200,.08); }
.compass-hero__grid { min-height: 780px; display:grid; grid-template-columns:minmax(0,1.16fr) minmax(330px,.84fr); align-items:center; gap:54px; padding-block:68px; }
.compass-hero__grid > * { position:relative; z-index:1; }
.compass-hero h1 { max-width:760px;margin:13px 0 20px; font-size:clamp(3rem,5.1vw,5rem); line-height:.98; letter-spacing:-.045em; text-transform:uppercase; }
.compass-hero h1 em { display:block; color:var(--compass-gold); font-style:normal;font-weight:500; }
.compass-hero__promise { max-width:720px; margin:0 0 7px; color:var(--compass-navy); font-family:var(--serif); font-size:clamp(1.25rem,1.9vw,1.62rem); font-weight:700; line-height:1.3; }
.compass-hero__lead { max-width:690px; margin:0 0 20px; color:#3f556a; font-size:1.05rem; line-height:1.62; }
.compass-hero__lead strong{color:#806a3d;font-weight:800;text-transform:uppercase}
.compass-hero__trust{display:grid;gap:11px;max-width:700px;margin:22px 0 0;padding:0;list-style:none}.compass-hero__trust li{display:flex;align-items:flex-start;gap:10px;color:#153653;font-size:.9rem;font-weight:700;line-height:1.45;list-style:none}.compass-hero__trust li::marker{content:""}.compass-hero__trust span{display:block;flex:0 0 auto;margin-top:0;color:#153653;border:0;background:transparent;font-size:.9rem;font-weight:800;line-height:1.4}
.compass-hero__clarification { display:inline-block; max-width:700px;margin:14px 0 0; padding-top:10px; color:#806a3d; border-top:1px solid rgba(199,163,90,.42); font-size:.82rem; font-weight:700; line-height:1.5;letter-spacing:.015em; }
.compass-hero__visual{position:relative;min-height:560px;display:grid;place-items:center}.compass-symbol { position:absolute; z-index:0; width:min(390px,34vw); aspect-ratio:1; display:grid; place-items:center; justify-self:center; border:1px solid rgba(199,163,90,.55); border-radius:50%; font-size:5rem; color:var(--compass-gold); }.compass-hero__product{position:relative;z-index:2;display:block;width:88%;max-width:500px;height:auto;object-fit:contain}
.compass-symbol::before,.compass-symbol::after { content:""; position:absolute; inset:12%; border:1px dashed rgba(21,54,83,.25); border-radius:50%; }.compass-symbol::after{inset:28%;border-style:solid}
.compass-section { padding-block:clamp(75px,9vw,125px); }.narrow{max-width:850px}.compass-intro{text-align:center;padding-block:clamp(70px,8vw,105px)}.compass-intro h2{max-width:820px;margin:24px auto 0;font-size:clamp(1.85rem,3.4vw,2.9rem);line-height:1.2}.faq-section h2{margin-bottom:14px;font-size:clamp(2.2rem,4.3vw,3.35rem);line-height:1.08}.faq-intro-copy{max-width:660px;margin:0;color:#52687b;line-height:1.65}
.compass-process { padding-block:clamp(64px,7vw,88px);color:#fff; background:#102b47; }.compass-process h2{width:100%;max-width:none;margin:16px 0 0;color:#fff;font-size:clamp(1.9rem,3.2vw,3rem);line-height:1.12}.process-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;align-items:stretch;gap:20px;margin:26px 0 0;padding:0;list-style:none}.process-grid li{height:100%;display:grid;grid-template-rows:auto auto 1fr;align-content:start;padding:32px;background:#faf8f3;border:1px solid var(--compass-champagne)}.process-grid li>span{color:#987a3f;font-weight:700;letter-spacing:.12em}.process-grid h3{margin:30px 0 16px;font-size:1.65rem;line-height:1.15}.process-grid p{margin:0;color:#52687b;line-height:1.65}
@media(min-width:1280px){.compass-process h2{font-size:clamp(3.25rem,4vw,3.75rem);white-space:nowrap}}
.mini-preview{background:#faf8f3}.mini-preview__grid{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:70px}.mini-preview h2{margin:14px 0 18px;font-size:clamp(2.5rem,4.5vw,4rem)}.mini-preview p:last-child{max-width:480px;color:#52687b;line-height:1.7}.mini-preview__art{position:relative;min-height:470px;display:grid;place-items:center;overflow:hidden}.mini-preview__product{display:block;width:82%;max-width:440px;height:auto;object-fit:contain;mix-blend-mode:multiply}
.mini-section { background:#eef3f5; }.mini-grid{display:grid;grid-template-columns:minmax(260px,.72fr) minmax(480px,1.28fr);gap:64px;align-items:start}.mini-copy{position:sticky;top:130px}.mini-copy h2{font-size:clamp(2.5rem,4vw,4rem);line-height:1.05}.mini-copy>p{color:#52687b;line-height:1.7}.simulation-note{margin-top:28px;padding:22px;border-left:3px solid var(--compass-gold);background:#fff}.simulation-note p{margin:8px 0 0;color:#52687b;line-height:1.55}
.form-card,.confirmation-card{padding:clamp(26px,5vw,52px);background:#fff;border:1px solid rgba(199,163,90,.45);box-shadow:0 18px 45px rgba(21,54,83,.08)}.field{margin-bottom:22px}.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.field label{display:block;margin-bottom:8px;font-weight:700}.optional-label{margin-left:7px;color:#607286;font-size:.72rem;font-weight:500;text-transform:uppercase;letter-spacing:.08em}.field input,.field select{width:100%;min-height:50px;padding:11px 13px;color:#153653;background:#fff;border:1px solid #9aa8b4;border-radius:2px;font:inherit}.field input:focus,.field select:focus{outline:3px solid rgba(199,163,90,.28);border-color:#8a6b31}.field input[aria-invalid="true"],.field select[aria-invalid="true"]{border-color:#a33b32}.field-error{min-height:1.3em;margin:6px 0 0;color:#9a3029;font-size:.82rem}.field-help{margin:7px 0 0;color:#607286;font-size:.82rem;line-height:1.55}.checks input{width:18px;height:18px;flex:0 0 18px;margin-top:2px;accent-color:#153653}.checks label{display:flex;gap:10px;align-items:flex-start;line-height:1.5}.checks a{color:#6f5526;text-decoration:underline}.legal-note{margin:4px 0 0;color:#607286;font-size:.76rem;line-height:1.55}.form-status{margin-bottom:22px;padding:15px;color:#7b2923;background:#fff2ef;border-left:3px solid #a33b32}.form-submit{width:100%;margin-top:12px}.form-footnote{text-align:center;color:#607286;font-size:.78rem}.confirmation-card{grid-column:2;text-align:center}.confirmation-card>span{display:block;color:var(--compass-gold);font-size:3rem}.confirmation-card h2{font-size:2.7rem}.confirmation-card p{color:#52687b;line-height:1.7}
.person-block{margin:0 0 28px;padding:clamp(20px,3vw,32px);border:1px solid rgba(21,54,83,.14);background:#fffdfa}.person-block legend{padding:0 10px 0 0;color:#153653;font-family:var(--serif);font-size:1.45rem;font-weight:600}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.form-field{min-width:0}.form-field--wide{grid-column:1/-1}.form-field label{display:block;margin-bottom:7px;color:#153653;font-size:.82rem;font-weight:720}.required-mark{color:#8a6b31}.form-field input,.form-field select{width:100%;min-height:48px;padding:11px 12px;color:#132133;background:#fff;border:1px solid #b7c1ca;border-radius:2px;font:inherit}.form-field input:focus,.form-field select:focus{outline:3px solid rgba(199,163,90,.42);outline-offset:2px;border-color:#153653}.form-field [aria-invalid="true"]{border-color:#9f342d;box-shadow:0 0 0 1px #9f342d}.birth-time-field>label{margin-bottom:4px}.time-selectors{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:12px}.birth-time-field>.field-help{margin-top:6px}.checkbox-row{display:grid!important;grid-template-columns:20px 1fr;align-items:start;gap:11px;color:#334b61;font-size:.88rem;line-height:1.5}.checkbox-row input{width:18px;height:18px;margin:2px 0 0;accent-color:#153653}.time-unknown{display:inline-flex!important;align-items:center;gap:9px;width:auto;margin:10px 0 0!important}.time-unknown input{flex:0 0 18px;width:18px;height:18px;min-height:18px;margin:0;padding:0}.unknown-note{width:94%;margin:9px 0 0;padding:14px 16px;color:#465e72;background:rgba(234,242,247,.7);border-left:3px solid #c7a35a;font-size:.8rem;line-height:1.55}.manual-place{grid-column:1/-1;display:grid;grid-template-columns:1fr;gap:14px;padding-top:4px}
.date-input-wrap{position:relative}.date-format-hint{display:none}
.faq-section{background:#faf8f3}.faq-list{margin-top:28px;border-top:1px solid rgba(199,163,90,.5)}.faq-list details{border-bottom:1px solid rgba(199,163,90,.5)}.faq-list summary{position:relative;padding:20px 42px 20px 0;cursor:pointer;font-weight:700;line-height:1.45;list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:"+";position:absolute;right:2px;top:50%;color:var(--compass-gold);font-size:1.4rem;font-weight:500;line-height:1;transform:translateY(-50%)}.faq-list details[open] summary::after{content:"−"}.faq-list details p{max-width:760px;margin:0;padding:0 42px 22px 0;color:#52687b;line-height:1.7}
@media(max-width:820px){.compass-hero__grid,.mini-grid,.mini-preview__grid{grid-template-columns:1fr}.compass-hero__grid{min-height:auto;padding-block:62px}.compass-hero__visual{min-height:360px}.compass-symbol{width:320px}.process-grid{grid-template-columns:1fr}.mini-preview__grid{gap:38px}.mini-preview__art{min-height:420px}.mini-copy{position:static}.confirmation-card{grid-column:1}.main-nav .button{margin-top:18px}}
@media(max-width:560px){
  .compass-landing .announcement{min-height:30px;padding:5px 10px;font-size:.58rem}
  .compass-landing .header-inner{min-height:68px}
  .compass-landing .brand__media,.compass-landing .brand--header .brand__media img{width:50px;height:50px}
  .compass-landing .menu-toggle{width:60px;height:60px;padding:16px}
  .compass-landing [id]{scroll-margin-top:116px}
  .compass-hero__grid{padding-block:48px 36px}
  .compass-hero h1{font-size:clamp(2.45rem,12vw,3.5rem)}
  .compass-hero__promise{font-size:1.18rem}
  .compass-hero__lead{font-size:.94rem}
  .compass-hero__trust{gap:12px;margin-top:21px}
  .compass-hero__trust li{font-size:.84rem}
  .compass-hero__clarification{font-size:.76rem}
  .compass-hero__visual{min-height:0;height:auto;margin:18px 0 0;padding:4px 0}
  .compass-hero__product{width:84%;max-width:360px;height:auto;object-fit:contain}
  .compass-symbol{width:min(270px,76vw)}
  .compass-section{padding-block:58px}
  .compass-intro{padding-block:56px}
  .compass-intro h2{font-size:clamp(2.25rem,9vw,2.8rem);line-height:1.15}
  .compass-process{padding-block:54px}
  .process-grid{grid-auto-rows:auto;gap:22px;margin-top:24px}
  .process-grid li{height:auto;padding:36px 30px}
  .process-grid h3{margin:22px 0 13px;font-size:clamp(1.75rem,7vw,2.15rem)}
  .mini-preview__grid{gap:26px}
  .mini-preview h2{font-size:clamp(2.5rem,9vw,3.25rem);line-height:1.1}
  .mini-preview__art{min-height:0;height:auto;margin:0;padding:4px 0 0}
  .mini-preview__product{width:84%;max-width:350px;height:auto;object-fit:contain;margin-inline:auto}
  .mini-grid{gap:32px}
  .mini-copy h2{font-size:clamp(2.5rem,9vw,3.25rem);line-height:1.1}
  .field-row,.form-grid,.manual-place{grid-template-columns:1fr}
  .field input:not([type="checkbox"]):not([type="radio"]),.field select,.field textarea,.form-field input:not([type="checkbox"]):not([type="radio"]),.form-field select,.form-field textarea{font-size:16px}
  .form-card,.confirmation-card{padding:24px 20px}
  .person-block{padding:20px 16px}
  .person-block legend{max-width:100%;font-size:clamp(1.8rem,7vw,2.25rem);line-height:1.15}
  .date-input-wrap .date-format-hint{position:absolute;left:13px;top:50%;display:block;color:#66798a;font-size:1rem;line-height:1;pointer-events:none;transform:translateY(-50%)}
  .date-input-wrap.has-value .date-format-hint,.date-input-wrap.is-active .date-format-hint{display:none}
  .faq-section h2{font-size:clamp(2.4rem,8vw,3rem);line-height:1.1}
  .faq-list{margin-top:24px}
  .faq-list summary{min-height:44px;padding:16px 40px 16px 0;font-size:clamp(1.45rem,5.8vw,1.8rem);line-height:1.24}
  .faq-list summary::after{top:17px;transform:none}
  .faq-list details p{padding:0 38px 18px 0}
  .announcement{font-size:.68rem}
  .confirmation-card h2{font-size:2.1rem}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.form-honeypot { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; pointer-events: none !important; }