:root { --ink:#00484e; --teal:#078e8b; --blue:#096ce7; --ivory:#fbf9f2; --gold:#bd9659; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--ivory); font-family:"Trebuchet MS","Segoe UI",sans-serif; }
a { color:inherit; text-decoration:none; }
.landing { position:relative; min-height:100vh; overflow:hidden; background:radial-gradient(circle at 62% 58%,rgba(174,234,231,.24),transparent 27%),linear-gradient(90deg,#fcfaf3 0%,#fffdf8 52%,#faf8f0 100%); }
.landing::before,.landing::after { content:""; position:absolute; pointer-events:none; opacity:.32; }
.landing::before { inset:0; background-image:linear-gradient(90deg,transparent 49.8%,rgba(11,115,116,.1) 50%,transparent 50.2%),radial-gradient(circle at 1px 1px,rgba(189,150,89,.24) 1px,transparent 1px); background-size:210px 100%,48px 48px; mask-image:linear-gradient(to bottom,#000,transparent 73%); }
.landing::after { width:780px; height:780px; right:-210px; top:105px; border:1px solid rgba(7,142,139,.12); border-radius:50%; box-shadow:0 0 0 74px rgba(7,142,139,.025),0 0 0 148px rgba(189,150,89,.025); }
.site-header { position:relative; z-index:10; height:132px; padding:22px clamp(42px,4.7vw,76px); display:flex; align-items:flex-start; justify-content:space-between; }
.brand { display:flex; align-items:center; gap:22px; text-transform:uppercase; letter-spacing:.18em; font-size:clamp(20px,2vw,32px); font-family:ui-monospace,"SFMono-Regular",monospace; }
.crest { position:relative; width:83px; height:78px; display:flex; justify-content:center; align-items:flex-end; gap:5px; padding:10px 16px 14px; border-bottom:2px solid var(--teal); border-radius:0 0 45% 45%; filter:drop-shadow(0 3px 2px rgba(0,88,91,.12)); }
.crest::before { content:"◉"; position:absolute; left:25px; bottom:0; font-size:28px; color:var(--teal); }
.crest i { width:4px; background:var(--teal); border-radius:3px 3px 0 0; }
.crest i:nth-child(1),.crest i:nth-child(5){height:30px}.crest i:nth-child(2),.crest i:nth-child(4){height:48px}.crest i:nth-child(3){height:66px}
nav { display:flex; gap:58px; padding-top:38px; font-size:20px; color:#073f45; }
nav a { transition:.2s ease; } nav a:hover,nav a:focus-visible { color:var(--teal); }
.hero { position:relative; z-index:2; min-height:630px; padding:103px clamp(42px,4.7vw,76px) 124px; }
.hero-copy { position:relative; z-index:5; width:56%; }
.circuit-line { display:block; position:relative; width:180px; height:20px; border-top:1px solid rgba(7,142,139,.7); }
.circuit-line::before,.circuit-line::after,.circuit-line i,.circuit-line b { content:""; position:absolute; top:-6px; width:10px; height:10px; border:1.5px solid rgba(7,142,139,.75); border-radius:50%; background:var(--ivory); }
.circuit-line::before { left:0; }.circuit-line::after { right:0; }.circuit-line i { right:20px; }.circuit-line b { right:-22px; transform:scale(.65); }
h1 { margin:18px 0 20px; font-family:"Trebuchet MS","Segoe UI",sans-serif; font-size:clamp(53px,5.05vw,82px); line-height:1.01; letter-spacing:-.055em; font-weight:700; color:#00484e; }
.hero-copy>p { margin:0; color:#414245; font-size:clamp(22px,2vw,33px); line-height:1.42; letter-spacing:-.02em; }
.actions { display:flex; align-items:center; gap:36px; margin-top:37px; }
.primary { min-width:346px; height:87px; padding:0 35px; display:flex; justify-content:center; align-items:center; gap:18px; color:white; background:linear-gradient(135deg,#0aa3a1,#00665f); border:1px solid rgba(255,255,255,.8); border-radius:16px; box-shadow:0 10px 20px rgba(0,78,76,.21),inset 0 0 0 1px rgba(255,255,255,.25); font-size:27px; font-weight:700; }
.primary:hover,.primary:focus-visible { transform:translateY(-2px); box-shadow:0 14px 26px rgba(0,78,76,.28); }
.door { font-size:35px; font-weight:400; }
.vision { display:flex; align-items:center; gap:30px; padding:15px 0 8px; border-bottom:2px solid var(--blue); color:var(--blue); font-size:24px; font-weight:700; }
.vision span { font-size:41px; line-height:0; }
.art { position:absolute; z-index:1; left:42%; right:-6%; top:-98px; bottom:-70px; overflow:hidden; }
.art img { width:100%; height:100%; object-fit:cover; object-position:58% center; mix-blend-mode:multiply; transform:scale(1.08); }
.app-card { position:absolute; z-index:6; right:4.6vw; top:138px; width:min(425px,31vw); min-height:379px; padding:42px 40px 30px; text-align:center; border:1px solid rgba(255,255,255,.9); border-radius:19px; background:rgba(255,255,255,.91); backdrop-filter:blur(12px); box-shadow:0 19px 40px rgba(0,65,66,.16); }
.app-glyph { width:78px; height:78px; margin:0 auto 15px; display:grid; place-items:center; border:1px dashed var(--teal); border-radius:50%; color:var(--teal); font-size:49px; }
.app-card h2 { margin:0 0 17px; font-size:29px; letter-spacing:-.03em; }
.soon { display:inline-block; padding:8px 23px; border:1px solid #99c7ff; border-radius:99px; background:#eef5ff; color:var(--blue); font-size:24px; }
.app-card .circuit-line { width:100%; margin:27px 0 9px; height:16px; }
.app-card .circuit-line::before,.app-card .circuit-line::after,.app-card .circuit-line i,.app-card .circuit-line b { display:none; }
.app-card .circuit-line::after { display:block; left:50%; right:auto; top:-5px; width:8px; height:8px; }
.app-card a { display:flex; align-items:center; gap:14px; color:var(--blue); font-size:22px; text-align:left; white-space:nowrap; }
.app-card a span { font-size:32px; }
.feature-row { position:relative; z-index:8; margin:-14px clamp(42px,4.6vw,70px) 40px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature { min-height:162px; padding:15px 30px 15px 22px; display:grid; grid-template-columns:136px 1fr 26px; align-items:center; border:1px solid rgba(189,150,89,.28); border-radius:15px; background:rgba(255,255,255,.9); box-shadow:0 14px 23px rgba(1,65,65,.09); }
.feature-icon { width:119px; height:119px; display:grid; place-items:center; border:1px solid rgba(7,142,139,.28); border-radius:50%; box-shadow:inset 0 0 0 9px rgba(7,142,139,.035),0 4px 12px rgba(7,142,139,.08); color:var(--teal); font-size:54px; }
.feature-copy strong { display:block; font-size:31px; line-height:1; }
.feature-copy .circuit-line { width:85px; height:14px; margin:17px 0 0; }
.feature-copy .circuit-line::after,.feature-copy .circuit-line i,.feature-copy .circuit-line b { display:none; }
.feature-copy small { display:block; max-width:250px; color:#565a5b; font-size:15px; line-height:1.45; }
.arrow { align-self:start; padding-top:14px; font-size:38px; }
@media(max-width:1000px){
  .site-header{height:110px}.brand{font-size:18px}.crest{width:60px;height:58px}.crest::before{left:17px;font-size:22px}.crest i:nth-child(1),.crest i:nth-child(5){height:22px}.crest i:nth-child(2),.crest i:nth-child(4){height:35px}.crest i:nth-child(3){height:48px}nav{gap:24px;padding-top:24px;font-size:16px}
  .hero{padding-top:60px}.hero-copy{width:64%}h1{font-size:clamp(48px,7vw,68px)}.hero-copy>p{font-size:22px}.primary{min-width:270px;height:70px;font-size:21px}.vision{font-size:19px}.app-card{top:210px;width:34vw;padding:28px 24px;min-height:320px}.app-card h2{font-size:22px}.app-card a{font-size:16px}.feature{grid-template-columns:82px 1fr 18px;padding:14px}.feature-icon{width:70px;height:70px;font-size:32px}.feature-copy strong{font-size:23px}
}
@media(max-width:720px){
  .landing{overflow:visible}.site-header{height:auto;padding:18px 22px;align-items:center}.brand{gap:11px;font-size:16px}.crest{width:46px;height:46px;padding:5px 10px}.crest::before{left:12px;font-size:18px}.crest i:nth-child(1),.crest i:nth-child(5){height:16px}.crest i:nth-child(2),.crest i:nth-child(4){height:25px}.crest i:nth-child(3){height:35px}nav{padding:0;gap:18px}nav a:not(:last-child){display:none}
  .hero{padding:58px 22px 55px;min-height:auto}.hero-copy{width:100%}h1{font-size:clamp(44px,12vw,63px)}.hero-copy>p{font-size:20px}.desktop-break{display:none}.actions{align-items:stretch;flex-direction:column;gap:10px}.primary{min-width:0;width:100%}.vision{justify-content:center;border-bottom:0}.art{position:relative;left:auto;right:auto;top:auto;bottom:auto;height:360px;margin:10px -22px -80px}.art img{object-position:65% center}.app-card{position:relative;right:auto;top:auto;width:100%;min-height:0;margin-top:20px;padding:28px}.feature-row{margin:22px;grid-template-columns:1fr}.feature{min-height:135px}.app-card a{justify-content:center}.app-glyph{width:64px;height:64px;font-size:38px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}