:root{--navy:#04142f;--navy2:#071e43;--blue:#008cff;--cyan:#28c7ff;--ink:#0b1731;--muted:#5e6b82;--line:#dfe8f4;--white:#fff;--shadow:0 22px 70px rgba(4,20,47,.13)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--ink);background:#fff;font-size:16px;line-height:1.6}a{color:inherit}.site-header{height:82px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(22px,5vw,78px);position:sticky;top:0;z-index:10;background:rgba(255,255,255,.94);backdrop-filter:blur(14px);border-bottom:1px solid rgba(15,70,130,.1)}.brand{display:flex;align-items:center;gap:10px;text-decoration:none}.brand-mark{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,#e9f1fa 15%,#009bff 55%,#0045a7);box-shadow:inset 0 0 0 3px rgba(255,255,255,.75);font-family:Orbitron,sans-serif;font-size:25px;font-style:italic;font-weight:700;color:white}.brand strong,.brand small{display:block;line-height:1}.brand strong{font-family:Orbitron,sans-serif;font-size:21px;letter-spacing:.08em}.brand small{font-weight:800;font-size:10px;letter-spacing:.42em;color:#087ede;margin-top:5px}nav{display:flex;gap:28px;align-items:center}nav a{text-decoration:none;font-weight:700;font-size:14px}.nav-ticket{padding:11px 18px;border-radius:999px;background:var(--navy);color:white}.hero{min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:7vw;padding:80px clamp(22px,7vw,110px);overflow:hidden;background:radial-gradient(circle at 85% 20%,rgba(0,153,255,.14),transparent 32%),linear-gradient(135deg,#f8fbff,#fff)}.hero-copy{max-width:670px}.eyebrow{text-transform:uppercase;letter-spacing:.18em;font-size:12px;font-weight:800;color:#087ede;margin:0 0 14px}.hero h1,.section-heading h2,.support-band h2,.ticket-copy h2,.thanks h1{font-size:clamp(42px,6vw,78px);line-height:1.02;letter-spacing:-.05em;margin:0}.hero h1 span{color:#087ede}.hero-intro{font-size:19px;color:var(--muted);max-width:650px;margin:28px 0}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.button{display:inline-flex;justify-content:center;align-items:center;min-height:52px;padding:0 24px;border-radius:10px;text-decoration:none;font-weight:800;border:0;cursor:pointer;font:inherit}.button.primary{background:linear-gradient(135deg,#0077e7,#00aaf4);color:white;box-shadow:0 12px 25px rgba(0,126,232,.25)}.button.secondary{background:white;border:1px solid var(--line);color:var(--ink)}.trust-row{display:flex;gap:24px;flex-wrap:wrap;margin-top:30px;font-size:13px;font-weight:700;color:#3f5069}.trust-row span:before{content:'✓';color:#008ee8;margin-right:7px}.brand-card{background:linear-gradient(145deg,#fff,#eef5fb);border:1px solid white;border-radius:28px;box-shadow:var(--shadow);padding:26px;transform:rotate(1.2deg);position:relative}.brand-card:after{content:'';position:absolute;inset:auto 7% -12px 7%;height:20px;background:#069ef2;filter:blur(24px);opacity:.25}.logo-window{width:100%;aspect-ratio:1.35;position:relative;overflow:hidden;border-radius:16px;background:white}.logo-window img{position:absolute;left:0;top:0;width:205%;max-width:none;height:auto}.brand-card>p{text-align:center;font-family:Orbitron,sans-serif;font-size:14px;letter-spacing:.14em;color:#0b75c9;margin:18px 0 0}.services{padding:100px clamp(22px,7vw,110px)}.section-heading{max-width:720px;margin-bottom:44px}.section-heading h2,.support-band h2,.ticket-copy h2{font-size:clamp(34px,4vw,54px)}.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.service-grid article{border:1px solid var(--line);border-radius:18px;padding:28px;background:white;transition:.2s}.service-grid article:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:#b8dcfb}.icon{font-size:30px;color:#008ce8}.service-grid h3{margin:13px 0 8px;font-size:18px}.service-grid p{margin:0;color:var(--muted);font-size:14px}.support-band{margin:0 clamp(22px,4vw,64px);border-radius:28px;padding:60px clamp(28px,6vw,80px);display:flex;justify-content:space-between;align-items:center;gap:40px;color:white;background:linear-gradient(120deg,#03132e 25%,#06376e 70%,#008fdc)}.support-band .eyebrow{color:#50ccff}.support-band p:not(.eyebrow){color:#cee4fa;max-width:650px}.support-band .button{background:#fff;color:#064b91;white-space:nowrap}.ticket-section{padding:110px clamp(22px,7vw,110px);display:grid;grid-template-columns:.72fr 1.28fr;gap:7vw;align-items:start;background:#f4f8fc}.ticket-copy>p:not(.eyebrow){color:var(--muted);font-size:18px}.contact-card{margin-top:32px;border-left:3px solid var(--blue);padding-left:18px;display:grid}.contact-card span{text-transform:uppercase;font-size:10px;font-weight:800;letter-spacing:.14em;color:var(--muted);margin-top:12px}.contact-card a{text-decoration:none;font-weight:800}.ticket-form{background:white;padding:34px;border-radius:22px;box-shadow:var(--shadow);display:grid;gap:18px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}label{font-size:14px;font-weight:700}label span{font-weight:400;color:var(--muted)}input,select,textarea{width:100%;margin-top:7px;padding:14px;border:1px solid #cfdbea;border-radius:9px;background:#fbfdff;font:inherit;color:var(--ink);outline:none}input:focus,select:focus,textarea:focus{border-color:#008fee;box-shadow:0 0 0 3px rgba(0,143,238,.12)}textarea{resize:vertical}.submit{width:100%;font-weight:800}.form-note{text-align:center;color:var(--muted);font-size:12px;margin:0}.hidden{display:none}footer{padding:42px clamp(22px,7vw,110px);background:var(--navy);color:#b6c9df;display:flex;justify-content:space-between;align-items:center;gap:24px;font-size:13px}.footer-brand strong{color:white}.thanks{min-height:100vh;background:radial-gradient(circle at top right,#0c86d7,#061a3b 45%,#020a17);display:grid;place-items:center;padding:22px}.thanks-card{width:min(600px,100%);background:white;border-radius:24px;padding:50px;text-align:center;box-shadow:var(--shadow)}.thanks-card .brand-mark{margin:0 auto 24px}.thanks-card p{color:var(--muted)}.thanks-card .button{margin-top:16px}
@media(max-width:900px){.hero{grid-template-columns:1fr;padding-top:58px}.brand-card{max-width:560px}.service-grid{grid-template-columns:repeat(2,1fr)}.ticket-section{grid-template-columns:1fr}.support-band{align-items:flex-start;flex-direction:column}.site-header nav>a:not(.nav-ticket){display:none}}
@media(max-width:600px){.site-header{height:72px;padding:0 16px}.brand strong{font-size:16px}.brand small{letter-spacing:.3em}.brand-mark{width:38px;height:38px}.nav-ticket{font-size:12px;padding:9px 12px}.hero{padding:48px 20px 60px;min-height:auto;gap:45px}.hero h1{font-size:45px}.hero-intro{font-size:17px}.hero-actions{display:grid}.button{width:100%}.trust-row{gap:9px 16px}.brand-card{padding:13px;border-radius:18px}.services{padding:70px 20px}.service-grid{grid-template-columns:1fr}.support-band{margin:0 14px;padding:38px 24px}.ticket-section{padding:75px 20px}.ticket-form{padding:22px 17px}.form-row{grid-template-columns:1fr}footer{flex-direction:column;align-items:flex-start}.footer-brand{display:none}}

/* Approved design: wide, service-led composition with the original business-card artwork. */
.site-header{height:88px}.brand-mark{background:linear-gradient(145deg,#effaff,#19a8f6 53%,#0751a6);border:1px solid #d7ebff;font-family:Inter,Arial,sans-serif;font-style:italic;font-weight:800}.brand strong{color:#102342}nav a:not(.nav-ticket){font-weight:600}.nav-ticket{border-radius:9px;background:linear-gradient(120deg,#006dd8,#0560be)}
.hero{min-height:475px;padding:45px clamp(24px,6.5vw,108px) 40px;grid-template-columns:1fr 1fr;gap:4vw;background:radial-gradient(circle at 78% 57%,#c6e5ff 0,transparent 37%),linear-gradient(135deg,#e8f5ff 0,#fff 30%,#f5fbff 72%,#031b43 100%)}
.hero h1{font-size:clamp(48px,4.8vw,80px);letter-spacing:-.055em}.eyebrow{letter-spacing:.16em}.hero .eyebrow{display:flex;gap:18px;align-items:center;flex-wrap:wrap;color:#205184}.hero .eyebrow i{display:inline-block;height:16px;border-left:2px solid #008eef}.hero-intro{font-size:clamp(17px,1.4vw,22px);color:#142944;max-width:590px;margin:20px 0}.hero .button{border-radius:8px}.hero .button.secondary{border-color:#087dea;color:#0753ad}
.brand-card{position:relative;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;transform:none;min-width:0}.brand-card:after{display:none}.logo-window{height:auto;aspect-ratio:1.62;background:transparent;overflow:hidden;border-radius:0}.logo-window img{position:absolute;left:-5.8%;top:0;width:189%;max-width:none;height:auto}.brand-script{position:absolute;right:0;top:46%;transform:rotate(-7deg);text-align:center!important;font-family:cursive!important;font-style:italic;font-size:clamp(19px,2.2vw,38px)!important;letter-spacing:0!important;line-height:1.1;color:#fff!important;text-shadow:0 2px 8px #164374;margin:0!important;width:26%}
.services{padding:0 clamp(18px,4vw,72px) 72px;margin-top:-16px;position:relative;z-index:1;background:linear-gradient(#f8fcff,#fff 60px)}.section-heading{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.service-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.service-grid article{padding:22px 14px;text-align:center;box-shadow:0 8px 22px rgba(5,40,94,.06);border-radius:13px}.service-grid .icon{font-size:39px;line-height:1.2;color:#1476d1}.service-grid h3{font-size:16px;line-height:1.25;margin:12px 0 6px}.service-grid p{font-size:14px;line-height:1.3}
.support-band{margin:0 clamp(18px,4vw,72px);border-radius:17px;padding:32px 40px;background:linear-gradient(115deg,#04162f,#0a3e78)}.support-band h2{font-size:32px}.ticket-section{padding:80px clamp(22px,6vw,100px);background:#f3f9ff}
@media(max-width:1100px){.service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.hero{min-height:0}.brand-script{top:40%}}
@media(max-width:750px){.hero{grid-template-columns:1fr;padding:56px 22px 45px;gap:30px;background:linear-gradient(145deg,#e8f5ff,#fff 70%,#e1f1ff)}.hero h1{font-size:clamp(42px,10vw,64px)}.hero .eyebrow{gap:8px}.hero .eyebrow i{height:12px}.brand-card{max-width:610px}.logo-window{aspect-ratio:1.62}.brand-script{color:#1268bc!important;text-shadow:none;top:40%}.services{margin-top:0;padding:20px 18px 60px}.service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ticket-section{grid-template-columns:1fr}.support-band{flex-direction:column;align-items:stretch}.support-band .button{width:auto}}
@media(max-width:480px){.site-header{height:70px}.hero{padding-top:40px}.hero .eyebrow{font-size:10px}.hero .eyebrow i:last-of-type{display:none}.hero-intro{font-size:17px}.brand-script{font-size:15px!important}.service-grid{gap:9px}.service-grid article{padding:18px 11px}.service-grid h3{font-size:14px}.service-grid p{font-size:13px}.support-band{padding:28px 22px}.ticket-section{padding-top:60px}}
.brand-script{position:static;transform:none;width:auto;text-align:right!important;font-family:Orbitron,Inter,sans-serif!important;font-size:13px!important;font-style:normal;letter-spacing:.12em!important;color:#0e68ba!important;text-shadow:none;margin:3px 9% 0 0!important}

/* Original compact logo in the header; services take the former hero-artwork space. */
.header-logo{display:block;width:210px;height:auto;object-fit:contain}
.hero{align-items:center;min-height:640px;grid-template-columns:minmax(0,1fr) minmax(490px,.98fr);gap:clamp(26px,4vw,72px);background:radial-gradient(circle at 83% 42%,#c6e7ff 0,transparent 36%),linear-gradient(135deg,#f5fbff,#fff 55%,#e7f5ff)}
.hero-copy{max-width:710px}.hero .services{margin:0;padding:0;position:static;background:none;min-width:0;scroll-margin-top:100px}
.hero .section-heading{position:static;width:auto;height:auto;overflow:visible;clip:auto;white-space:normal;margin:0 0 14px}
.hero .section-heading .eyebrow{display:none}.hero .section-heading h2{font-size:22px;letter-spacing:-.025em;margin:0;color:#0d3161}
.hero .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.hero .service-grid article{text-align:left;padding:18px 19px;min-height:155px;border:1px solid #d5e8fa;background:rgba(255,255,255,.94);box-shadow:0 12px 35px rgba(8,57,115,.08)}
.hero .service-grid .icon{font-size:27px}.hero .service-grid h3{font-size:15px;margin:5px 0 4px}.hero .service-grid p{font-size:13px;line-height:1.36}
@media(max-width:1000px){.hero{grid-template-columns:1fr;min-height:0}.hero .services{width:100%}.hero .service-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:750px){.header-logo{width:185px}.hero .service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.hero .service-grid article{min-height:150px}}
@media(max-width:480px){.header-logo{width:148px}.hero .section-heading h2{font-size:20px}.hero .service-grid{gap:9px}.hero .service-grid article{padding:14px 12px;min-height:165px}.hero .service-grid h3{font-size:14px}.hero .service-grid p{font-size:12px}}

/* Frame the actual metallic Spoto artwork as a compact horizontal header mark. */
.street-logo{display:flex;align-items:center;gap:2px;width:232px;height:70px;overflow:hidden}
.street-mark,.street-wordmark{display:block;position:relative;flex:none;overflow:hidden;background-image:url("spoto-business-card.png");background-repeat:no-repeat;background-size:316px 169px}
.street-mark{width:90px;height:68px;background-position:-57px -2px}
.street-wordmark{width:140px;height:40px;background-position:-27px -61px}
@media(max-width:600px){.street-logo{width:179px;height:55px;gap:0}.street-mark,.street-wordmark{background-size:252px 135px}.street-mark{width:70px;height:54px;background-position:-46px -1px}.street-wordmark{width:109px;height:34px;background-position:-22px -48px}}

/* Keep the contact heading visible below the sticky navigation. */
#contact{scroll-margin-top:88px}

/* Direct contact details in the original two-column contact layout. */
#contact>.contact-card{margin-top:0;background:#fff;padding:28px 34px 34px;border-radius:22px;box-shadow:var(--shadow);border-left:3px solid var(--blue);gap:4px}
#contact>.contact-card a{font-size:clamp(16px,2vw,22px);overflow-wrap:anywhere}#contact>.contact-card a:hover{text-decoration:underline}#contact>.contact-card a:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
@media(max-width:600px){#contact>.contact-card{padding:22px 20px 28px}}

/* Crisp vector header identity, independent of the business-card background. */
.header-identity{display:flex;align-items:center;gap:12px}
.identity-mark{display:block;width:54px;height:54px;flex:none}
.identity-type{display:flex;flex-direction:column;gap:5px}
.identity-name{font-family:Inter,Arial,sans-serif;font-size:29px;line-height:1;font-weight:800;letter-spacing:.055em;color:#102342}
.identity-descriptor{font-family:Inter,Arial,sans-serif;font-size:10px;line-height:1;font-weight:700;letter-spacing:.36em;color:#0878cd}
@media(max-width:600px){.header-identity{gap:9px}.identity-mark{width:42px;height:42px}.identity-name{font-size:23px}.identity-descriptor{font-size:8px;letter-spacing:.34em}}

/* Restored metallic Spoto identity on a clean white header. */
.site-header{background:#fff}.original-logo{display:flex;align-items:center;width:240px;height:78px;overflow:hidden}.original-logo img{display:block;width:100%;height:auto;max-width:none}
@media(max-width:600px){.original-logo{width:185px;height:60px}}

/* Use the same original logo in the footer and header. */
footer .footer-logo{display:flex;align-items:center;justify-content:center;flex:none;width:220px;height:80px;padding:0 10px;overflow:hidden;background:#fff;border-radius:10px}footer .footer-logo img{display:block;width:100%;height:auto}
@media(max-width:600px){footer .footer-logo{display:flex;width:200px;height:72px}}
