/* Round two / Conversion Signal — wordmark-only, sharper conversion hierarchy */
:root {
  --paper: #f3f4ef;
  --cream: #fffdf6;
  --ink: #11191d;
  --navy: #0b2633;
  --navy-2: #113746;
  --muted: #5a6468;
  --line: #cdd3d2;
  --coral: #ff6949;
  --blue: #304fda;
  --lime: #d6fb70;
  --yellow: #ffda58;
  --mint: #b7ead6;
  --shadow: 0 18px 0 var(--navy);
  --soft-shadow: 0 18px 55px rgba(11,38,51,.1);
  --motion-ease: cubic-bezier(.16,1,.3,1);
}
.option-three .site-header { min-height: 76px; background: rgba(11,38,51,.96); border-bottom: 1px solid rgba(255,255,255,.16); }
.option-three .brand { gap: 0; color: var(--cream); font-size: 1.04rem; line-height: 1; letter-spacing: -.045em; }
.option-three .brand-mark { display: none; }
.option-three .brand > span:not(.brand-mark) { display: inline-flex; align-items: baseline; }
.option-three .brand br { display: none; }
.option-three .brand strong { margin-left: .34em; color: var(--lime); }
.option-three .site-header nav > a { color: var(--cream); }
.option-three .site-header nav > a:hover, .option-three .site-header nav > a:focus-visible { text-decoration-color: var(--lime); }
.option-three .button { position: relative; overflow: hidden; border: 1px solid var(--lime); border-radius: 6px; background: var(--lime); color: var(--navy); box-shadow: none; transition: transform .22s var(--motion-ease), background .22s ease, border-color .22s ease; }
.option-three .button::after { content: ''; position: absolute; inset: 0; background: rgba(255,255,255,.42); transform: translateX(-115%) skewX(-18deg); transition: transform .48s var(--motion-ease); pointer-events: none; }
.option-three .button:hover { transform: translateY(-2px); background: var(--cream); box-shadow: none; }
.option-three .button:hover::after, .option-three .button:focus-visible::after { transform: translateX(115%) skewX(-18deg); }
.option-three .button > span, .option-three .card-link > span, .option-three .text-link > span { transition: transform .22s var(--motion-ease); }
.option-three .button:hover > span, .option-three .button:focus-visible > span, .option-three .card-link:hover > span, .option-three .card-link:focus-visible > span { transform: translateX(4px); }
.option-three .button-outline { border-color: currentColor; background: transparent; }
.option-three .hero { position: relative; isolation: isolate; background: var(--navy); color: var(--cream); border-bottom: 8px solid var(--coral); }
.option-three .hero-grid { position: relative; z-index: 2; min-height: 760px; grid-template-columns: 1.03fr .97fr; }
.option-three .signal-field { --signal-y: 0px; position: absolute; z-index: 0; top: 5%; right: -7%; width: min(55vw, 790px); aspect-ratio: 1; border: 1px solid rgba(214,251,112,.18); border-radius: 50%; opacity: .82; transform: translate3d(0,var(--signal-y),0); pointer-events: none; }
.option-three .signal-field::before, .option-three .signal-field::after { content: ''; position: absolute; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; }
.option-three .signal-field::before { inset: 13%; }
.option-three .signal-field::after { inset: 31%; border-color: rgba(255,105,73,.22); }
.option-three .signal-field span { position: absolute; width: 10px; height: 10px; border: 2px solid var(--navy); border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 7px rgba(214,251,112,.12); }
.option-three .signal-field span:nth-child(1) { left: 9%; top: 30%; }
.option-three .signal-field span:nth-child(2) { right: 18%; top: 15%; background: var(--coral); box-shadow: 0 0 0 7px rgba(255,105,73,.1); }
.option-three .signal-field span:nth-child(3) { right: 7%; bottom: 30%; background: var(--cream); box-shadow: 0 0 0 7px rgba(255,255,255,.08); }
.option-three .hero h1 { font-size: clamp(4rem, 6.1vw, 6.9rem); letter-spacing: -.06em; }
.option-three .hero h1 em { color: var(--lime); }
.option-three .hero-lede, .option-three .trust-list { color: #cbd8dc; }
.option-three .field-tag { color: var(--lime); }
.option-three .hero .text-link { color: var(--cream); }
.option-three .lead-board { --tilt-x: 0deg; --tilt-y: 0deg; --board-y: 0px; border: 1px solid rgba(255,255,255,.5); border-radius: 14px; background: rgba(238,240,235,.88); color: var(--ink); box-shadow: 0 .5px 0 rgba(255,255,255,.9), 14px 14px 0 var(--coral), 0 30px 70px rgba(0,0,0,.24); backdrop-filter: blur(18px) saturate(1.08); -webkit-backdrop-filter: blur(18px) saturate(1.08); transform: perspective(1100px) translate3d(0,var(--board-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); transform-style: preserve-3d; transition: transform .24s var(--motion-ease), box-shadow .24s ease; will-change: transform; }
.option-three .lead-board::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(circle at var(--shine-x, 75%) var(--shine-y, 15%), rgba(255,255,255,.74), transparent 38%); opacity: .42; pointer-events: none; }
.option-three .lead-board > * { position: relative; z-index: 1; }
.option-three .board-pin { display: none; }
.option-three .board-head { padding-top: 0; }
.option-three .lead-card { border-radius: 7px; box-shadow: none; transition: transform .22s var(--motion-ease), border-color .22s ease, background .22s ease; }
.option-three .lead-card:hover { transform: translateX(4px); border-color: var(--blue); background: #fff; }
.option-three .board-stamp { right: -8px; bottom: -12px; border: 1px solid var(--coral); background: var(--lime); color: var(--navy); transform: none; }
.option-three .principle-strip { background: var(--blue); }
.option-three .thesis { padding-block: 105px; }
.option-three .thesis h2 em { color: var(--blue); }
.option-three .section-heading { grid-template-columns: .22fr 1fr; }
.option-three .section-heading h2 { max-width: 820px; }
.option-three .service-card, .option-three .work-card, .option-three .product-card { --shine-x: 50%; --shine-y: 50%; border-radius: 12px; box-shadow: none; transition: transform .25s var(--motion-ease), box-shadow .25s ease, border-color .25s ease; }
.option-three .service-card::after, .option-three .work-card::after { content: ''; position: absolute; z-index: 3; inset: 0; border-radius: inherit; background: radial-gradient(circle at var(--shine-x) var(--shine-y), rgba(255,255,255,.34), transparent 34%); opacity: 0; transition: opacity .24s ease; pointer-events: none; }
.option-three .service-card:hover::after, .option-three .work-card:hover::after { opacity: 1; }
.option-three .service-card:hover, .option-three .work-card:hover { transform: translateY(-4px); box-shadow: 0 20px 46px rgba(11,38,51,.14); }
.option-three .service-card.featured { border: 0; background: var(--blue); box-shadow: inset -6px 0 0 var(--lime); }
.option-three .website-service { padding-bottom: 225px; }
.option-three .featured .kicker, .option-three .featured .service-index { color: var(--lime); }
.option-three .ink-card { background: var(--navy); border-color: var(--navy); }
.option-three .browser-card, .option-three .scorecard, .option-three .dashboard { transform: none; box-shadow: 5px 5px 0 var(--lime); transition: transform .3s var(--motion-ease), box-shadow .3s ease; }
.option-three .service-card:hover .browser-card, .option-three .work-card:hover .scorecard, .option-three .work-card:hover .dashboard { transform: translate3d(-3px,-5px,0); box-shadow: 8px 10px 0 var(--lime); }
.option-three .method { background: var(--navy); }
.option-three .method-copy .button { background: var(--lime); color: var(--navy); }
.option-three .work-card.lead-audit { border: 0; background: var(--yellow); box-shadow: inset 0 -6px 0 var(--navy); }
.option-three .about { background: var(--blue); color: var(--cream); border: 0; }
.option-three .about-title .index { color: var(--lime); }
.option-three .about-copy > p:not(.big), .option-three .about-copy dd { color: #e2e7ff; }
.option-three .about-copy dl > div { border-color: rgba(255,255,255,.28); }
.option-three .route-line { border-color: var(--cream); }
.option-three .route-line i { border-color: var(--cream); background: var(--blue); }
.option-three .route-line i:nth-child(3) { background: var(--lime); border-color: var(--navy); }
.option-three .guides-band { background: var(--navy); }
.option-three .guide-covers span { border-width: 1px; border-radius: 2px; box-shadow: 9px 9px 0 var(--coral); }
.option-three .final-cta { border-top: 8px solid var(--lime); }
.option-three .site-footer { background: #061820; }
.option-three .site-footer .brand { color: var(--cream); }
.option-three .audit-dialog { border: 1px solid var(--navy); border-radius: 10px; box-shadow: 8px 8px 0 var(--coral); }
.option-three .page-hero { background: var(--navy); color: var(--cream); border-bottom-color: var(--coral); }
.option-three .page-hero h1 em { color: var(--lime); }
.option-three .page-hero > .shell > p:last-child { color: #cbd8dc; }
.option-three .product-card.featured-product { box-shadow: inset 0 -6px 0 var(--navy); }

/* Motion is progressive enhancement: content stays visible until JS confirms support. */
.option-three.motion-ready [data-reveal] { opacity: 0; transform: translateY(24px); transition: opacity .62s var(--motion-ease), transform .62s var(--motion-ease); }
.option-three.motion-ready [data-reveal][data-visible] { opacity: 1; transform: none; }
.option-three.motion-ready [data-reveal][data-parallax-card] { transform: perspective(1100px) translate3d(0,calc(var(--board-y) + 24px),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); }
.option-three.motion-ready [data-reveal][data-parallax-card][data-visible] { transform: perspective(1100px) translate3d(0,var(--board-y),0) rotateX(var(--tilt-x)) rotateY(var(--tilt-y)); }
.option-three.motion-ready .service-grid [data-reveal]:nth-child(2), .option-three.motion-ready .work-grid [data-reveal]:nth-child(2) { transition-delay: .07s; }
.option-three.motion-ready .service-grid [data-reveal]:nth-child(3), .option-three.motion-ready .work-grid [data-reveal]:nth-child(3) { transition-delay: .14s; }
.option-three.motion-ready .lead-board[data-visible] .lead-card { animation: signal-card-in .46s var(--motion-ease) both; }
.option-three.motion-ready .lead-board[data-visible] .lead-card:nth-child(6) { animation-delay: .12s; }
.option-three.motion-ready .lead-board[data-visible] .lead-card:nth-child(8) { animation-delay: .24s; }
.option-three.motion-ready .lead-board[data-visible] .board-connector span { position: relative; overflow: hidden; }
.option-three.motion-ready .lead-board[data-visible] .board-connector span::after { content: ''; position: absolute; left: -2px; top: -8px; width: 6px; height: 8px; border-radius: 999px; background: var(--coral); animation: signal-travel .72s .38s var(--motion-ease) both; }
.option-three.motion-ready .lead-board[data-visible] .board-connector:nth-child(7) span::after { animation-delay: .68s; }
.option-three.motion-ready .lead-board[data-visible] .ready i { animation: ready-ping 1.45s .8s ease-out 2; }
.option-three .faq-list summary span { transition: transform .2s var(--motion-ease); }
.option-three .method-steps li { transition: padding-left .22s var(--motion-ease), border-color .22s ease; }
.option-three .method-steps li:hover { padding-left: 10px; border-color: var(--lime); }

@keyframes signal-card-in { from { opacity: 0; transform: translateY(10px) scale(.985); } to { opacity: 1; transform: none; } }
@keyframes signal-travel { from { transform: translateY(-8px); opacity: 0; } 20% { opacity: 1; } to { transform: translateY(34px); opacity: 0; } }
@keyframes ready-ping { 0% { box-shadow: 0 0 0 0 rgba(42,137,92,.42); } 100% { box-shadow: 0 0 0 12px rgba(42,137,92,0); } }

@media (hover: none), (pointer: coarse) {
  .option-three .service-card:hover, .option-three .work-card:hover, .option-three .lead-card:hover { transform: none; box-shadow: none; }
  .option-three .service-card:hover .browser-card, .option-three .work-card:hover .scorecard, .option-three .work-card:hover .dashboard { transform: none; box-shadow: 5px 5px 0 var(--lime); }
}
@media (max-width: 960px) {
  .option-three .site-header nav { background: var(--navy); border-bottom-color: var(--coral); box-shadow: 0 9px 0 var(--coral); }
  .option-three .site-header nav > a { border-bottom-color: rgba(255,255,255,.2); color: var(--cream); }
  .option-three .hero-grid,
  .option-three .section-heading { grid-template-columns: 1fr; }
  .option-three .signal-field { top: 36%; right: -30%; width: 100vw; opacity: .55; }
  .option-three .lead-board { --tilt-x: 0deg !important; --tilt-y: 0deg !important; --board-y: 0px !important; will-change: auto; }
}
@media (max-width: 640px) {
  .option-three .hero h1 { font-size: clamp(3.35rem, 14.7vw, 4.55rem); }
  .option-three .lead-board { box-shadow: 7px 7px 0 var(--coral); }
  .option-three .signal-field { top: 48%; right: -55%; width: 145vw; }
  .option-three .about h2 { color: var(--cream); }
}
@media (prefers-reduced-motion: reduce) {
  .option-three .signal-field, .option-three .lead-board, .option-three.motion-ready [data-reveal], .option-three.motion-ready [data-reveal][data-parallax-card] { opacity: 1; transform: none; will-change: auto; }
  .option-three .service-card::after, .option-three .work-card::after, .option-three .lead-board::before { display: none; }
}
