:root{color-scheme:dark;--bg:#071b2d;--panel:#12334e;--panel2:#0c2940;--cyan:#70d8e8;--gold:#d6b46a;--white:#f3f7fb;--muted:#b7c9d9;--line:rgba(112,216,232,.2);--max:1120px}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--white);font:16px/1.65 Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;opacity:.28;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60' viewBox='0 0 120 60'%3E%3Cg fill='none' stroke='%23133b58' stroke-width='1'%3E%3Cpath d='M0 60a30 30 0 0 1 60 0M60 60a30 30 0 0 1 60 0M-30 30a30 30 0 0 1 60 0M30 30a30 30 0 0 1 60 0M90 30a30 30 0 0 1 60 0'/%3E%3C/g%3E%3C/svg%3E");background-size:120px 60px;animation:waveDrift 18s ease-in-out infinite alternate}
a{color:inherit}.wrap{width:min(var(--max),calc(100% - 48px));margin:auto}.demo-note{padding:7px 12px;background:#102b43;color:var(--muted);text-align:center;font-size:12px;letter-spacing:.04em;border-bottom:1px solid var(--line)}.topbar{position:sticky;z-index:5;top:0;background:rgba(7,27,45,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--line)}.nav{min-height:76px;display:flex;justify-content:space-between;align-items:center;gap:22px}.brand img{display:block;width:245px;max-width:56vw}.navlinks{display:flex;align-items:center;gap:22px;font-size:14px}.navlinks a{text-decoration:none}.navlinks a:hover,.navlinks a[aria-current=page]{color:var(--cyan)}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:11px 18px;background:var(--cyan);color:#082137;text-decoration:none;font-weight:800;border-radius:3px;transition:transform .2s,filter .2s}.button:hover{transform:translateY(-2px);filter:brightness(1.06)}main{overflow:hidden}.hero{padding:74px 0 66px}.hero-grid{display:grid;grid-template-columns:1fr .85fr;gap:44px;align-items:center}.eyebrow{color:var(--cyan);font-size:12px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.gold{color:var(--gold)}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(42px,6vw,72px);line-height:1.03;letter-spacing:-.055em;margin:17px 0 20px}h2{font-size:clamp(29px,4vw,42px);line-height:1.12;letter-spacing:-.035em;margin-bottom:15px}h3{font-size:20px;line-height:1.25;margin-bottom:9px}.hero-copy,.lead{font-size:17px;color:var(--muted);max-width:700px}.hero-copy{margin-bottom:24px}.hero-art{min-height:290px;display:grid;place-items:center;position:relative}.hero-art:before{content:"";position:absolute;width:min(74vw,270px);aspect-ratio:1;border:1px solid rgba(112,216,232,.28);border-radius:50%;box-shadow:0 0 0 34px rgba(112,216,232,.04),0 0 0 68px rgba(112,216,232,.025)}.hero-mark{position:relative;width:112px;height:112px;background:linear-gradient(145deg,#0b2e62,#16539a);display:grid;place-items:center;box-shadow:0 24px 54px #0005;transform:rotate(3deg);animation:pageFloat 6s ease-in-out infinite}.hero-mark img{width:72px}.stat-chip{position:absolute;padding:12px 15px;background:var(--panel);border:1px solid var(--line);box-shadow:0 12px 30px #0004;font-size:13px}.stat-chip.one{left:0;bottom:30px}.stat-chip.two{right:0;top:30px;color:var(--gold)}section{padding:54px 0}.section-head{max-width:770px;margin-bottom:26px}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.card{padding:24px;background:rgba(18,51,78,.9);border:1px solid var(--line);transition:transform .25s,border-color .25s,box-shadow .25s}.card:hover{transform:translateY(-4px);border-color:rgba(214,180,106,.55);box-shadow:0 18px 36px #0003}.card p{margin-bottom:0;color:var(--muted)}.num{display:inline-grid;place-items:center;width:39px;height:39px;background:#193a55;color:var(--cyan);font-size:13px;font-weight:800;margin-bottom:15px}.placeholder{display:grid;place-items:center;min-height:145px;margin-bottom:15px;padding:14px;text-align:center;color:#b7c9d9;background:linear-gradient(145deg,#0d2b43,#17415e);border:1px dashed rgba(112,216,232,.32);font-size:13px}.split{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:start}.list{padding-left:20px;color:var(--muted)}.list li{padding:5px 0}.callout{padding:31px;background:linear-gradient(120deg,rgba(18,51,78,.97),rgba(12,41,64,.93));border:1px solid var(--line)}.callout p{color:var(--muted)}.contact-link{color:var(--cyan);font-weight:800;overflow-wrap:anywhere}.contact-grid{display:grid;grid-template-columns:.76fr 1.24fr;gap:24px;align-items:start}.contact-details{display:grid;gap:12px}.detail{padding:16px 18px;background:rgba(18,51,78,.88);border:1px solid var(--line)}.detail strong{display:block;color:var(--gold);font-size:12px;letter-spacing:.08em;text-transform:uppercase}.detail span,.detail a{color:var(--muted);overflow-wrap:anywhere}.contact-form{padding:26px;background:rgba(18,51,78,.9);border:1px solid var(--line)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{display:grid;gap:6px}.field.full{grid-column:1/-1}.field label{font-size:13px;font-weight:700}.field input,.field textarea,.field select{width:100%;padding:12px 13px;color:var(--white);background:#09243a;border:1px solid rgba(183,201,217,.28);border-radius:0;font:inherit}.field textarea{min-height:135px;resize:vertical}.field input:focus,.field textarea:focus,.field select:focus{outline:2px solid var(--cyan);outline-offset:1px}.form-hint{color:var(--muted);font-size:13px;margin:13px 0 16px}.form-status{min-height:25px;color:var(--gold);font-size:13px;margin:12px 0 0}.footer{margin-top:34px;border-top:1px solid var(--line);padding:24px 0;color:var(--muted);font-size:13px}.footerin{display:flex;align-items:center;justify-content:space-between;gap:18px}.footerlogo{width:205px;max-width:55vw}.js-reveal .reveal{opacity:0;transform:translateY(18px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1)}.js-reveal .reveal.in{opacity:1;transform:none}.js-reveal .reveal.from-left{transform:translateX(-48px)}.js-reveal .reveal.from-left.in{transform:translateX(0)}@keyframes waveDrift{from{background-position:0 0}to{background-position:0 18px}}@keyframes pageFloat{0%,100%{transform:translateY(0) rotate(3deg)}50%{transform:translateY(-10px) rotate(1deg)}}
@media(max-width:780px){.wrap{width:min(var(--max),calc(100% - 36px))}.nav{align-items:flex-start;flex-direction:column;justify-content:center;gap:9px;padding:13px 0}.brand img{width:210px}.navlinks{gap:14px;flex-wrap:wrap;font-size:13px}.navlinks a{min-height:34px;display:inline-flex;align-items:center}.navlinks .button{min-height:42px}.hero{padding:48px 0 32px}.hero-grid,.split,.contact-grid{grid-template-columns:1fr;gap:15px}.hero-copy,.lead{font-size:16px}.hero-art{min-height:245px}.grid{grid-template-columns:1fr}.card{padding:21px}section{padding:42px 0}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.contact-form{padding:21px}.footerin{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}body:before,.hero-mark{animation:none}.js-reveal .reveal,.js-reveal .reveal.from-left{opacity:1;transform:none;transition:none}.button,.card{transition:none}}


.main-site-return{display:block;min-width:285px;padding:9px 13px;text-decoration:none;border-left:3px solid var(--gold);background:rgba(18,51,78,.78);line-height:1.25}.main-site-return strong{display:block;color:var(--white);font-size:15px}.main-site-return span{display:block;margin-top:3px;color:var(--cyan);font-size:12px;font-weight:800}.main-site-return:hover strong{color:var(--cyan)}
@media(max-width:780px){.main-site-return{width:100%;min-width:0;padding:8px 11px}.main-site-return strong{font-size:14px}}


.invoice-details{padding:0}.invoice-details summary{cursor:pointer;list-style:none;padding:16px 18px;color:var(--gold);font-size:12px;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.invoice-details summary::-webkit-details-marker{display:none}.invoice-details summary:after{content:"+";float:right;color:var(--cyan);font-size:17px;line-height:1}.invoice-details[open] summary{border-bottom:1px solid var(--line)}.invoice-details[open] summary:after{content:"−"}.invoice-details>div{padding:13px 18px 16px;color:var(--muted);overflow-wrap:anywhere}

.lang-switch{color:var(--gold)!important;font-weight:800;letter-spacing:.04em}

/* Light cream and gold theme for the multi-page business website examples. */
:root{color-scheme:light;--bg:#f7f3ea;--panel:#fffdf8;--panel2:#efe7d7;--cyan:#123b70;--gold:#b88b35;--white:#0b2d55;--muted:#516882;--line:rgba(16,54,94,.17)}
body{background:var(--bg);color:var(--white)}
body:before{opacity:.3;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='60' viewBox='0 0 120 60'%3E%3Cg fill='none' stroke='%23c9a653' stroke-width='1'%3E%3Cpath d='M0 60a30 30 0 0 1 60 0M60 60a30 30 0 0 1 60 0M-30 30a30 30 0 0 1 60 0M30 30a30 30 0 0 1 60 0M90 30a30 30 0 0 1 60 0'/%3E%3C/g%3E%3C/svg%3E")}
.demo-note{background:#eee7d9;color:var(--muted)}
.topbar{background:rgba(247,243,234,.92)}
.navlinks a:hover,.navlinks a[aria-current=page]{color:var(--gold)}
.button{background:var(--cyan);color:#fff}
.eyebrow{color:#9a7025}
.hero-art:before{border-color:rgba(184,139,53,.4);box-shadow:0 0 0 34px rgba(184,139,53,.06),0 0 0 68px rgba(184,139,53,.035)}
.stat-chip{background:rgba(255,253,248,.96);box-shadow:0 12px 30px rgba(36,50,66,.12)}
.stat-chip.two{color:#946c20}
.card{background:rgba(255,253,248,.9);border-color:rgba(184,139,53,.24)}
.card:hover{border-color:rgba(184,139,53,.62);box-shadow:0 18px 36px rgba(52,58,63,.11)}
.num{background:#efe4cb;color:#8b681f}
.placeholder{color:#395676;background:linear-gradient(145deg,#f0e8d9,#fffdf8);border-color:rgba(184,139,53,.48)}
.callout{background:linear-gradient(120deg,rgba(255,253,248,.98),rgba(239,231,215,.94));border-color:rgba(184,139,53,.28)}
.detail,.contact-form{background:rgba(255,253,248,.92);border-color:var(--line)}
.detail strong{color:#946c20}
.detail span,.detail a{color:var(--muted)}
.contact-link{color:var(--cyan)}
.field input,.field textarea,.field select{color:var(--white);background:#fffdf8;border-color:rgba(16,54,94,.24)}
.field input::placeholder,.field textarea::placeholder{color:#718198}
.main-site-return{background:rgba(255,253,248,.92)}
.footer{border-color:var(--line)}
.invoice-details summary{color:#946c20}
.lang-switch{color:#946c20!important}