:root{
  --blue:#0091FF;
  --blue-dark:#0070C9;
  --ink:#0E1420;
  --ink-2:#4B5563;
  --line:#E4E8EE;
  --wash:#F3F6FA;
  --white:#FFFFFF;
  --max:1120px;
  --gutter:20px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;color:var(--ink);background:var(--white);line-height:1.55;font-weight:500;font-size:17px}
img,svg,video,iframe{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{line-height:1.08;letter-spacing:-0.02em;font-weight:800}
h1{font-size:clamp(2.4rem,8.5vw,4.6rem)}
h2{font-size:clamp(1.85rem,5.5vw,2.9rem);margin-bottom:.75em}
h3{font-size:1.15rem;font-weight:700;letter-spacing:-0.01em}
p{max-width:38em}
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding:0 var(--gutter)}
.section{padding:72px 0}
.lead{font-size:1.15rem;color:var(--ink-2)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5em;font-weight:700;font-size:1rem;padding:15px 24px;border-radius:999px;text-decoration:none;border:2px solid transparent;transition:background .15s,color .15s,border-color .15s;cursor:pointer;min-height:48px}
.btn-primary{background:var(--blue);color:#fff}
.btn-primary:hover{background:var(--blue-dark)}
.btn-ghost{background:transparent;color:var(--ink);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--ink)}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:3px}

/* Header */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:saturate(180%) blur(10px);-webkit-backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line)}
.header .wrap{display:flex;align-items:center;justify-content:space-between;height:66px}
.logo{display:block;height:34px;width:auto}
.nav{display:flex;gap:18px;font-weight:600;font-size:.92rem}
.nav a{text-decoration:none;color:var(--ink-2)}
.nav a:hover,.nav a[aria-current]{color:var(--ink)}
.header .btn{padding:11px 18px;min-height:40px;font-size:.92rem}

/* Hero */
.hero{position:relative;color:#fff;background:var(--ink);overflow:hidden;min-height:88svh;display:flex;align-items:flex-end}
.hero-media{position:absolute;inset:0}
.hero-media img{width:100%;height:100%;object-fit:cover;opacity:.55}
.hero-media iframe{position:absolute;top:50%;left:50%;width:177.78vh;min-width:100%;height:56.25vw;min-height:100%;transform:translate(-50%,-50%);opacity:.55;border:0;pointer-events:none;display:none}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(14,20,32,.1) 0%,rgba(14,20,32,.55) 55%,rgba(14,20,32,.92) 100%);pointer-events:none}
.hero .wrap{position:relative;z-index:1;padding-top:120px;padding-bottom:56px}
.hero h1{max-width:11em;margin-bottom:20px}
.hero p{font-size:1.15rem;color:rgba(255,255,255,.82);margin-bottom:28px}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px}
.hero .btn-ghost{color:#fff;border-color:rgba(255,255,255,.45)}
.hero .btn-ghost:hover{border-color:#fff}
.hero-meta{margin-top:40px;display:flex;flex-wrap:wrap;gap:8px 24px;font-size:.92rem;color:rgba(255,255,255,.7);font-weight:600}

/* Three-up text blocks with a top rule */
.rule-grid{display:grid;gap:28px;margin-top:8px}
.rule-grid h3{margin-bottom:8px}
.rule-grid p{color:var(--ink-2)}
.rule-grid > div{padding-top:20px;border-top:2px solid var(--ink)}

/* Split section (text + list) on a wash */
.split{background:var(--wash)}
.split .wrap{display:grid;gap:28px}
.tile-list{display:grid;gap:14px}
.tile{padding:22px 24px;background:#fff;border:1px solid var(--line);border-radius:14px}
.tile strong{display:block;font-size:1.1rem;margin-bottom:4px;letter-spacing:-0.01em}
.tile span{color:var(--ink-2);font-size:.98rem}

/* Dark band with the bolt path */
.dark{background:var(--ink);color:#fff}
.dark h2{max-width:14em}
.dark .lead{color:rgba(255,255,255,.72)}
.bolt{position:relative;margin-top:40px;padding-left:46px}
.bolt svg{position:absolute;left:0;top:6px;width:30px;height:calc(100% - 12px)}
.bolt ol{list-style:none;display:grid;gap:40px}
.bolt li{position:relative}
.bolt li::before{content:"";position:absolute;left:-46px;top:6px;width:30px;height:30px;border-radius:50%;background:var(--blue);box-shadow:0 0 0 6px var(--ink)}
.bolt small{display:block;color:var(--blue);font-weight:700;font-size:.85rem;margin-bottom:4px;letter-spacing:.01em}
.bolt h3{font-size:1.5rem;margin-bottom:8px;color:#fff}
.bolt p{color:rgba(255,255,255,.75)}

/* Values */
.values{display:grid;gap:22px 32px;margin-top:8px}
.values div{padding-top:18px;border-top:1px solid var(--line)}
.values h3{margin-bottom:6px}
.values p{color:var(--ink-2);font-size:1rem}

/* Quote */
.quote{background:var(--wash)}
.quote blockquote{font-size:clamp(1.35rem,4vw,1.9rem);font-weight:700;line-height:1.3;letter-spacing:-0.015em;max-width:24em}
.quote cite{display:block;margin-top:18px;font-style:normal;color:var(--ink-2);font-size:1rem;font-weight:600}

/* Team */
.team{background:var(--wash)}
.team-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px 18px;margin-top:8px}
.avatar{aspect-ratio:1;border-radius:16px;background:#D9E3EF;overflow:hidden;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:2rem;color:var(--blue-dark);margin-bottom:12px}
.avatar img{width:100%;height:100%;object-fit:cover}
.person strong{display:block;font-size:1.05rem;letter-spacing:-0.01em}
.person span{color:var(--ink-2);font-size:.95rem}

/* FAQ */
.faq details{border-top:1px solid var(--line)}
.faq details:last-of-type{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:20px 0;font-weight:700;font-size:1.08rem;display:flex;justify-content:space-between;align-items:center;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.5rem;font-weight:500;color:var(--blue);flex:none;transition:transform .2s}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{padding:0 0 22px;color:var(--ink-2)}

/* Blue call-to-action band */
.cta{background:var(--blue);color:#fff}
.cta h2{max-width:13em}
.cta p{color:rgba(255,255,255,.88);font-size:1.12rem;margin-bottom:28px}
.cta .btn-primary{background:#fff;color:var(--blue-dark)}
.cta .btn-primary:hover{background:#EAF4FF}
.cta .btn-ghost{color:#fff;border-color:rgba(255,255,255,.55)}
.cta .btn-ghost:hover{border-color:#fff}
.cta-actions{display:flex;flex-wrap:wrap;gap:12px}
.cta small{display:block;margin-top:22px;color:rgba(255,255,255,.78);font-size:.92rem}

/* Careers teaser on home */
.teaser{display:grid;gap:24px;align-items:center}
.teaser-card{background:var(--ink);color:#fff;border-radius:20px;padding:32px 26px}
.teaser-card h2{color:#fff;margin-bottom:.5em}
.teaser-card p{color:rgba(255,255,255,.78);margin-bottom:24px}

/* Contact */
.contact .wrap{display:grid;gap:32px}
.contact h3{margin-bottom:6px}
.contact address{font-style:normal;color:var(--ink-2);line-height:1.6}
.contact a{text-decoration:none}
.contact a:hover{text-decoration:underline}

/* Footer */
.footer{background:var(--ink);color:rgba(255,255,255,.72);padding:56px 0 36px;font-size:.95rem}
.footer .wrap{display:grid;gap:32px}
.footer .logo{height:40px}
.footer h3{color:#fff;font-size:1rem;margin-bottom:8px}
.footer address{font-style:normal;line-height:1.6}
.footer a{text-decoration:none}
.footer a:hover{text-decoration:underline;color:#fff}
.footer nav{display:grid;gap:8px;font-weight:600}
.social{display:flex;flex-wrap:wrap;align-items:center;gap:14px}
.social a{display:block;line-height:0}
.social img{width:28px;height:28px;object-fit:contain}
.social img[src*="tiktok"]{border-radius:6px}
.legal{border-top:1px solid rgba(255,255,255,.15);padding-top:20px;font-size:.85rem;display:flex;flex-wrap:wrap;gap:6px 24px;justify-content:space-between}

/* Mobile sticky CTA */
.mobile-cta{position:fixed;left:0;right:0;bottom:0;z-index:60;padding:10px var(--gutter) calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-top:1px solid var(--line);display:flex;gap:10px}
.mobile-cta .btn{flex:1}
body.has-mobile-cta{padding-bottom:78px}

@media (min-width:720px){
  :root{--gutter:32px}
  .section{padding:104px 0}
  .nav{gap:28px;font-size:.95rem}
  .logo{height:38px}
  .rule-grid{grid-template-columns:repeat(3,1fr);gap:40px}
  .rule-grid.four{grid-template-columns:repeat(4,1fr);gap:32px}
  .split .wrap{grid-template-columns:1fr 1.2fr;align-items:start;gap:56px}
  .tile-list{gap:16px}
  .values{grid-template-columns:repeat(3,1fr)}
  .team-grid{grid-template-columns:repeat(4,1fr);gap:32px 24px}
  .bolt{padding-left:0;margin-top:56px}
  .bolt svg{display:none}
  .bolt ol{grid-template-columns:repeat(3,1fr);gap:40px}
  .bolt li{padding-top:30px}
  .bolt li::before{left:0;top:0;width:100%;height:4px;border-radius:2px;box-shadow:none;background:var(--blue)}
  .bolt li:nth-child(2)::before{opacity:.65}
  .bolt li:nth-child(3)::before{opacity:.35}
  .teaser{grid-template-columns:1fr 1fr;gap:48px}
  .teaser-card{padding:48px 44px}
  .contact .wrap{grid-template-columns:1.2fr 1fr 1fr}
  .footer .wrap{grid-template-columns:1.4fr 1fr 1fr 1fr}
  .legal{grid-column:1 / -1}
  .mobile-cta{display:none}
  body.has-mobile-cta{padding-bottom:0}
  .hero .wrap{padding-top:160px;padding-bottom:88px}
  .hero-media iframe{display:block}
  .hero-media img.has-video{display:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hero-media iframe{display:none!important}
  .hero-media img.has-video{display:block!important}
  *{transition:none!important}
}

/* Icons */
.icon{width:46px;height:46px;stroke-width:1.5;color:var(--blue);margin-bottom:14px}
.tile .icon{margin-bottom:10px}

/* Instagram */
.insta .lead a{color:var(--blue);text-decoration:none;font-weight:700}
.insta .lead a:hover{text-decoration:underline}
.insta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:24px}
.insta-grid > div{aspect-ratio:1;border-radius:10px;background:linear-gradient(135deg,#E7EEF6,#D5E2EF)}
@media (min-width:720px){.insta-grid{grid-template-columns:repeat(6,1fr);gap:12px}}

/* Single-file views */
[hidden]{display:none!important}
section[id]{scroll-margin-top:66px}

/* Instagram posts: one horizontal carousel, cropped to the photo or video only */
.insta-nav{display:none;justify-content:flex-end;gap:10px;margin-top:-44px}
.insta-nav button{width:44px;height:44px;border-radius:50%;border:2px solid var(--line);background:#fff;color:var(--ink);font-size:1.6rem;line-height:1;cursor:pointer;font-family:inherit;padding-bottom:4px}
.insta-nav button:hover{border-color:var(--ink)}
.insta-feed{display:grid;grid-auto-flow:column;grid-auto-columns:328px;gap:16px;margin-top:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.insta-feed::-webkit-scrollbar{display:none}
.insta-tile{position:relative;aspect-ratio:1/1.22;overflow:hidden;border-radius:14px;background:var(--wash);scroll-snap-align:start}
.insta-tile iframe.instagram-media{display:block;margin:-55px 0 0 -1px!important;width:calc(100% + 2px)!important;min-width:0!important;max-width:none!important;border:0!important;border-radius:0!important;box-shadow:none!important}
.insta-tile blockquote.instagram-media{height:100%;margin:0;display:grid;place-items:center;padding:16px;text-align:center}
.insta-tile blockquote.instagram-media a{color:var(--blue);font-weight:700;text-decoration:none}
@media (min-width:720px){.insta-nav{display:flex}}

/* Photos */
.photo{display:block;width:100%;border-radius:16px;object-fit:cover}
.photo-band{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-top:40px}
.photo-band img{width:100%;height:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
.photo-band img:first-child{grid-column:span 2;aspect-ratio:16/9}
.split .photo{aspect-ratio:16/10;margin-top:28px;object-position:80% center}
.quote-grid{display:grid;gap:28px;align-items:center}
.quote-grid .photo{aspect-ratio:4/3;object-position:70% center}
.team .photo.wide{aspect-ratio:16/9;margin:8px 0 32px}
.teaser .photo{aspect-ratio:4/3;margin-top:24px}
.gallery{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:28vw;grid-auto-flow:dense;gap:10px;margin-top:8px}
.gallery img{width:100%;height:100%;object-fit:cover;border-radius:14px;grid-row:span 2}
.gallery .wide{grid-column:span 2}
@media (min-width:720px){
  .photo-band{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:56px}
  .photo-band img:first-child{grid-column:auto;aspect-ratio:4/3}
  .quote-grid{grid-template-columns:1.1fr 1fr;gap:56px}
  .team .photo.wide{aspect-ratio:2.2/1;object-position:center 35%;margin-bottom:48px}
  .gallery{grid-template-columns:repeat(4,1fr);grid-auto-rows:190px;gap:16px}
}

/* Phone header: keep logo, three links and the button on one line */
@media (max-width:719px){
  .logo{height:28px}
  .nav{gap:13px;font-size:.84rem}
  .header .btn{padding:8px 13px;min-height:36px;font-size:.84rem;white-space:nowrap}
}
@media (max-width:379px){.nav a:first-child{display:none}}

/* People: senior team with photos, sales trainers as a name list */
.roster-title{margin:44px 0 16px;font-size:1.25rem}
.roster{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:0 18px}
.roster li{padding:12px 0;border-top:1px solid #D5DEE8}
.roster strong{display:block;font-size:1rem;letter-spacing:-0.01em}
.roster span{color:var(--ink-2);font-size:.92rem}
@media (min-width:720px){.team-grid{grid-template-columns:repeat(3,1fr)}.roster{grid-template-columns:repeat(3,1fr);gap:0 32px}}
@media (min-width:1000px){.team-grid{grid-template-columns:repeat(6,1fr);gap:20px}}

/* Home hero plays the video at every size; careers hero is a photo */
.hero-media iframe{display:block}
.hero-media img.has-video{display:none}
.photo.banner{aspect-ratio:16/9;margin-top:40px;object-position:center 35%}
.photo-pair{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}
.photo-pair img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px}
@media (min-width:720px){.photo.banner{aspect-ratio:2.4/1;margin-top:56px}}

/* Contact: map with office pins, addresses stacked beside it */
.aus-map{width:100%;max-width:440px;height:auto;display:block;font-family:inherit}
.aus-map .land{fill:#E3EBF4;stroke:#C5D3E2;stroke-width:1.5;stroke-linejoin:round}
.aus-map .pin{fill:var(--blue)}
.aus-map text{font-size:17px;font-weight:700;fill:var(--ink)}
.offices{display:grid;gap:24px}
@media (min-width:720px){.contact .wrap{grid-template-columns:1fr 1.25fr .8fr;align-items:center}}

/* Life at Bolt: show the first rows, reveal the rest on tap */
.gallery.collapsed{max-height:204vw;overflow:hidden;-webkit-mask-image:linear-gradient(#000 90%,transparent);mask-image:linear-gradient(#000 90%,transparent)}
.gallery-more{margin-top:20px}
@media (min-width:720px){.gallery.collapsed{max-height:900px}}

/* Home hero: full-screen video, nav and a slightly larger logo floating over the top */
.view[data-view="home"] .header{position:fixed;left:0;right:0;top:0;transition:background .2s,border-color .2s}
.logo-on-video{display:none}
.header.overlay{background:transparent;border-bottom-color:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
.header.overlay .wrap{height:80px}
.header.overlay .logo{display:none}
.header.overlay .logo-on-video{display:block;height:46px}
.header.overlay .nav a{color:rgba(255,255,255,.85)}
.header.overlay .nav a:hover,.header.overlay .nav a[aria-current]{color:#fff}
.view[data-view="home"] .hero{min-height:100svh}
.view[data-view="home"] .hero-media iframe{opacity:.7}
@media (min-width:720px){.header.overlay .wrap{height:104px}.header.overlay .logo-on-video{height:68px}}
@media (max-width:719px){.nav a:first-child{display:none}}
