:root {
--tws-ink: #082765;
--tws-forest: #0a3375;
--tws-deep: #06122a; 
--tws-cream: #eef8f8;
--tws-cream-soft: #d7ebec;
--tws-paper: #fbfdff;
--tws-coral: #09aeb4;
--tws-accent: #04777c;
--tws-muted: #566781;
--tws-line: rgba(8, 39, 101, 0.12);
--tws-shadow: 0 1px 2px rgba(8,39,101,.04), 0 18px 48px rgba(8,39,101,.10);
--tws-radius: 16px;
--tws-ease: cubic-bezier(.22, 1, .36, 1);
--font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
}
@media (prefers-reduced-motion: reduce) {
html { scroll-behavior: auto; }
*, *::before, *::after {
animation-duration: 0.01ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.01ms !important;
}
.prem-reveal { opacity: 1 !important; transform: none !important; }
}
h1, .hero h1, .service-hero h1, .case-study-hero h1 {
font-family: var(--font-display) !important;
font-weight: 600 !important;
letter-spacing: -0.03em !important;
line-height: 1.08 !important;
}
h2, .hero-studio h2 {
font-family: var(--font-display) !important;
font-weight: 600 !important;
letter-spacing: -0.025em !important;
line-height: 1.15 !important;
}
.hero-lede, .contact-lede, .section-heading > p {
font-size: clamp(1.05rem, 1.35vw, 1.2rem) !important;
line-height: 1.7 !important;
max-width: 40rem;
}
.site-header {
position: sticky;
top: 0;
z-index: 40;
background: rgba(251, 253, 255, 0.97) !important;
border-bottom: 1px solid var(--tws-line) !important;
transition: box-shadow .35s var(--tws-ease), background .35s var(--tws-ease);
}
.site-header.is-scrolled {
box-shadow: 0 8px 28px rgba(8,39,101,.07);
background: rgba(251, 253, 255, 0.96) !important;
}
.button, a.button {
background: var(--tws-ink) !important;
border: 1px solid var(--tws-ink) !important;
color: #fff !important;
border-radius: 999px !important;
min-height: 48px !important;
padding: 0 1.35rem !important;
font-weight: 600 !important;
letter-spacing: .04em !important;
box-shadow: 0 10px 24px rgba(8,39,101,.18);
transition: transform .25s var(--tws-ease), background .2s ease, box-shadow .25s var(--tws-ease);
display: inline-flex !important;
align-items: center;
justify-content: center;
text-decoration: none !important;
}
.button:hover, a.button:hover {
background: var(--tws-forest) !important;
transform: translateY(-1px);
box-shadow: 0 14px 28px rgba(8,39,101,.24);
}
.button-secondary, a.button-secondary {
background: transparent !important;
border: 1.5px solid rgba(8,39,101,.35) !important;
color: var(--tws-ink) !important;
border-radius: 999px !important;
min-height: 48px !important;
padding: 0 1.25rem !important;
font-weight: 600 !important;
box-shadow: none !important;
display: inline-flex !important;
align-items: center;
justify-content: center;
}
.button-secondary:hover, a.button-secondary:hover {
border-color: var(--tws-ink) !important;
background: rgba(8,39,101,.04) !important;
}
.button-small, a.button-small {
min-height: 44px !important;
padding: 0 1rem !important;
font-size: 12px !important;
}
.hero {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: clamp(2.6rem, 5.5vw, 4.25rem) 0 clamp(2.8rem, 5.5vw, 4.5rem) !important;
background: var(--tws-deep) !important;
color: var(--tws-cream) !important;
border-top: none !important;
overflow: hidden;
position: relative;
}
.hero::before {
content: "";
position: absolute;
inset: 0;
background:
radial-gradient(900px 420px at 18% 0%, rgba(9,174,180,.18), transparent 55%),
radial-gradient(700px 380px at 92% 80%, rgba(4,119,124,.12), transparent 50%);
pointer-events: none;
}
.hero .shell.hero-grid {
position: relative;
z-index: 1;
}
.hero .eyebrow {
color: var(--tws-coral) !important;
}
.hero h1 {
color: var(--tws-cream) !important;
font-size: clamp(2.2rem, 4.8vw, 3.6rem) !important;
max-width: 14ch;
}
.hero h1 em {
color: var(--tws-cream-soft) !important;
font-style: italic !important;
font-family: var(--font-display) !important;
font-weight: 500 !important;
}
.hero .hero-lede {
color: rgba(238, 248, 248, 0.78) !important; 
}
.hero .button {
background: var(--tws-coral) !important;
border-color: var(--tws-coral) !important;
color: #042628 !important;
box-shadow: 0 10px 28px rgba(9,174,180,.28);
}
.hero .button:hover {
background: #0bc4cb !important;
border-color: #0bc4cb !important;
}
.hero .button-secondary {
background: transparent !important;
border: 1.5px solid rgba(238,248,248,.55) !important;
color: var(--tws-cream) !important;
}
.hero .button-secondary:hover {
background: rgba(238,248,248,.08) !important;
border-color: var(--tws-cream) !important;
}
.hero .text-link {
color: var(--tws-cream-soft) !important;
}
.hero .hero-studio {
background: rgba(238, 248, 248, 0.06) !important;
border: 1px solid rgba(238,248,248,.14);
border-radius: var(--tws-radius);
padding: clamp(1.4rem, 3vw, 2rem) !important;
box-shadow: none !important;
color: var(--tws-cream) !important;
}
.hero .hero-studio h2 {
color: var(--tws-cream) !important;
font-size: clamp(1.25rem, 2vw, 1.55rem) !important;
}
.hero .hero-offer {
border-color: rgba(238,248,248,.14) !important;
}
.hero .hero-offer li {
border-color: rgba(238,248,248,.12) !important;
color: var(--tws-cream) !important;
}
.hero .hero-offer strong {
color: var(--tws-coral) !important;
font-weight: 600 !important;
font-size: 0.95rem !important;
letter-spacing: 0.01em;
}
.hero .hero-studio-note {
color: rgba(238,248,248,.65) !important;
}
.section, .packages, .addons, .work, .process, .about, .contact {
padding-top: clamp(3.25rem, 6vw, 4.75rem) !important;
padding-bottom: clamp(3.25rem, 6vw, 4.75rem) !important;
}
.package-card, .addon-card, .portfolio-card, .process-card, .service-price-card {
border-radius: var(--tws-radius) !important;
box-shadow: var(--tws-shadow) !important;
border: 1px solid var(--tws-line) !important;
transition: transform .3s var(--tws-ease), box-shadow .3s var(--tws-ease);
}
.package-card:hover, .portfolio-card:hover, .addon-card:hover {
transform: translateY(-3px);
box-shadow: 0 4px 8px rgba(8,39,101,.05), 0 22px 48px rgba(8,39,101,.12) !important;
}
.package-card .price {
color: var(--tws-ink) !important; 
font-family: var(--font-display) !important;
font-size: 1.7rem !important;
white-space: nowrap;
font-weight: 600 !important;
}
.package-card .price-note {
color: #3d4d63 !important; 
}
.package-card.featured {
border-color: rgba(9,174,180,.45) !important;
box-shadow: 0 1px 2px rgba(8,39,101,.04), 0 18px 48px rgba(9,174,180,.14) !important;
}
.service-price-card strong {
font-family: var(--font-display) !important;
font-size: clamp(1.4rem, 2.5vw, 1.85rem) !important;
color: var(--tws-ink) !important;
}
.service-hero {
background: linear-gradient(180deg, #06122a 0%, #0a1f42 100%) !important;
color: var(--tws-cream) !important;
padding: clamp(2.5rem, 5vw, 4rem) 0 !important;
}
.service-hero .eyebrow { color: var(--tws-coral) !important; }
.service-hero h1 { color: var(--tws-cream) !important; }
.service-hero .service-summary { color: rgba(238,248,248,.78) !important; }
.service-hero .button {
background: var(--tws-coral) !important;
border-color: var(--tws-coral) !important;
color: #042628 !important;
}
.service-hero .button-secondary {
border-color: rgba(238,248,248,.55) !important;
color: var(--tws-cream) !important;
}
.service-hero .text-link { color: var(--tws-cream-soft) !important; }
.service-hero .service-price-card {
background: rgba(238,248,248,.08) !important;
border: 1px solid rgba(238,248,248,.16) !important;
color: var(--tws-cream) !important;
}
.service-hero .service-price-card strong { color: var(--tws-coral) !important; }
.service-hero .service-price-card small,
.service-hero .service-price-card p { color: rgba(238,248,248,.7) !important; }
.prem-reveal {
opacity: 0;
transform: translateY(14px);
transition: opacity .7s var(--tws-ease), transform .7s var(--tws-ease);
}
.prem-reveal.is-in {
opacity: 1;
transform: none;
}
@media (max-width: 520px) {
.site-header {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: .5rem !important;
padding: .65rem 4% !important;
}
.site-header .brand {
flex: 1 1 auto;
min-width: 0;
}
.site-header .brand img {
max-height: 36px !important;
width: auto !important;
}
.site-header .desktop-nav,
.site-header .header-ctas {
display: none !important;
}
.site-header .mobile-menu {
flex: 0 0 auto;
margin-left: auto;
}
.hero {
padding: 2rem 0 2.4rem !important;
}
.hero .hero-actions {
flex-direction: column !important;
align-items: stretch !important;
gap: .75rem !important;
}
.hero .button,
.hero .button-secondary {
width: 100%;
}
}
@media (max-width: 860px) {
.hero .shell.hero-grid {
grid-template-columns: 1fr !important;
gap: 1.75rem !important;
}
}
*, .site-header, header { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.package-card.featured .price { color: #eef8f8 !important; }
.package-card.featured .price-note { color: #d5e4e4 !important; }
.hero-actions .text-link,
a.addon-quote,
.faq-list summary {
min-height: 44px !important;
display: inline-flex !important;
align-items: center !important;
padding: 0.35rem 0 !important;
}
.hero .hero-offer--desc {
list-style: none;
margin: 1rem 0 0;
padding: 0;
display: grid;
gap: .85rem;
}
.hero .hero-offer--desc li {
display: grid;
gap: .2rem;
border: none !important;
border-bottom: 1px solid rgba(238,248,248,.12) !important;
padding: 0 0 .85rem !important;
}
.hero .hero-offer--desc li:last-child { border-bottom: none !important; padding-bottom: 0 !important; }
.hero .hero-offer--desc .tier-name {
font-size: .72rem;
letter-spacing: .08em;
text-transform: uppercase;
color: #09aeb4 !important;
font-weight: 600;
}
.hero .hero-offer--desc .tier-desc {
color: rgba(238,248,248,.78) !important;
font-size: .95rem;
line-height: 1.45;
}
.hero .hero-studio-cta { margin: 1.1rem 0 0; }
.hero .hero-studio-cta .button {
width: 100%;
}
.hero-work-link {
margin: .85rem 0 0 !important;
}
.hero-work-link .text-link {
display: inline-flex !important;
align-items: center !important;
gap: .5rem !important;
letter-spacing: .02em;
white-space: nowrap;
}
.hero-work-arrow {
display: inline-block !important;
margin-left: 0 !important;
font-size: 1.05em;
line-height: 1;
transform: translateY(1px);
}
@media (max-width: 520px) {
.review-bar { display: none !important; }
.site-header {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
gap: .5rem !important;
padding: .55rem 4% !important;
}
.site-header .brand img {
max-height: 32px !important;
width: auto !important;
}
}
.section,
.addons,
.work,
.process,
.about,
.faq,
.contact,
footer {
content-visibility: auto;
contain-intrinsic-size: auto 720px;
scroll-margin-top: 5.5rem;
}
.hero { content-visibility: visible !important; contain-intrinsic-size: none !important; }
html { scroll-behavior: auto !important; }
.package-card, .addon-card, .portfolio-card, .process-step, .care-row, .service-price-card {
content-visibility: auto;
contain-intrinsic-size: auto 420px;
contain: layout style;
}
.package-card:hover, .portfolio-card:hover, .addon-card:hover {
transform: none !important;
}
@media (max-width: 860px) {
.package-card, .addon-card, .portfolio-card, .process-step, .care-row,
.package-card:hover, .portfolio-card:hover, .addon-card:hover {
box-shadow: none !important;
transform: none !important;
}
.site-header { backdrop-filter: none !important; }
}
@media (max-width: 860px) {
.hero-proof, .hero-studio { box-shadow: none !important; }
}

.hero .hero-offer--desc .tier-desc{text-transform:none!important;letter-spacing:normal!important;font-weight:400!important;color:rgba(238,248,248,.78)!important}
.hero .hero-offer--desc .tier-name{text-transform:uppercase!important}
.contact .form-privacy a,.contact-card .form-privacy a{color:#9fd9dc!important;text-decoration:underline}
.process-grid article > span{color:#035e62!important}

/* Contact must stay dark (site CSS); do not lighten */
.contact{background:#082765!important;color:#fff!important}
.contact h2,.contact .eyebrow,.contact .contact-intro,.contact .light-link{color:inherit}
.contact .contact-intro{color:#b8c5c2!important}
.contact .light-link,.contact a.text-link{color:#9fd9dc!important}
.contact-card{color:#082765!important;background:#fff!important}

/* ---- Prices restored 2026-10-05: quick-start entry offers + package prices ---- */
.hero .hero-offer--desc .tier-head{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem;flex-wrap:wrap}
.hero .hero-offer--desc .tier-price{text-transform:none!important;font-family:var(--font-display)!important;font-size:1.05rem!important;font-weight:600!important;color:#eef8f8!important;letter-spacing:0!important;white-space:nowrap;font-variant-numeric:lining-nums}
.hero .hero-offer--desc{padding-top:.85rem!important}
.hero .hero-quick-link{margin:1rem 0 0}
.hero .hero-quick-link a{color:#7fe3e6;font-weight:700;font-size:.95rem;text-underline-offset:4px;text-decoration:underline;min-height:44px;display:inline-flex;align-items:center}
.quick-start{background:linear-gradient(135deg,#eaf6f7 0%,#f6fbfc 100%);border:1px solid rgba(9,174,180,.28);border-radius:var(--tws-radius);padding:clamp(1.25rem,3vw,2rem);margin:0 0 clamp(2.25rem,4vw,3rem)}
.quick-start-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.35rem 1.25rem;margin-bottom:1.25rem}
.quick-start-head .eyebrow{margin:0!important}
.quick-start-head h3{margin:0;font-family:var(--font-display);font-weight:600;font-size:clamp(1.3rem,2.2vw,1.6rem);letter-spacing:-.02em;line-height:1.2;color:var(--tws-ink)}
.offer-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.offer-card{background:#fff;border:1px solid var(--tws-line);border-top:3px solid var(--tws-coral);border-radius:14px;padding:1.4rem 1.4rem 1.25rem;display:flex;flex-direction:column;min-width:0}
.offer-tag{font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:800;color:var(--tws-accent)}
.offer-card h4{margin:.5rem 0 .5rem;font-family:var(--font-display);font-weight:600;font-size:clamp(1.15rem,1.8vw,1.35rem);line-height:1.25;letter-spacing:-.015em;color:var(--tws-ink)}
.offer-desc{margin:0 0 1rem;color:#3d4d63;font-size:.98rem;line-height:1.55}
.offer-price{margin:auto 0 .85rem;font-family:var(--font-display);font-weight:600;font-size:2.1rem;line-height:1;color:var(--tws-ink);font-variant-numeric:lining-nums;white-space:nowrap}
.offer-terms{list-style:none;margin:0 0 1.15rem;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.offer-terms li{background:#f1f7f8;border-radius:10px;padding:.55rem .7rem;display:grid;gap:.1rem;min-width:0}
.offer-terms span{font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:800;color:#4a5b72}
.offer-terms strong{font-size:.92rem;font-weight:700;color:var(--tws-ink);line-height:1.3}
.offer-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem 1.1rem}
.offer-actions .button{min-height:44px!important}
.offer-wa{color:var(--tws-ink);font-weight:700;font-size:12px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;min-height:44px;padding:0 1.1rem;border:1.5px solid rgba(8,39,101,.35);border-radius:999px;display:inline-flex;align-items:center;justify-content:center}
.offer-wa:hover{border-color:var(--tws-ink);background:rgba(8,39,101,.04)}
.offer-note{margin:1rem 0 0;color:#3d4d63;font-size:.9rem;line-height:1.5}
.packages-head{margin:0 0 1rem}
.packages-head .eyebrow{margin:0!important}
.care-price{display:block;margin-top:.35rem;font-family:var(--font-display);font-weight:600;font-size:1.35rem;color:var(--tws-ink);white-space:nowrap}
.care-price span{font-family:inherit;font-size:.95rem;font-weight:500;color:#3d4d63}
@media (max-width:760px){
.offer-grid{grid-template-columns:minmax(0,1fr)}
.offer-actions{display:grid;grid-template-columns:minmax(0,1fr)}
.offer-actions .button,.offer-actions .offer-wa{width:100%}
}
@media (max-width:380px){.offer-terms{grid-template-columns:minmax(0,1fr)}}

/* ---- v2: hero aside quick-start group + Getting found link ---- */
.hero .hero-group-label{margin:1.15rem 0 .55rem;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:rgba(238,248,248,.62)!important}
.hero .hero-quick{list-style:none;margin:0;padding:.35rem .9rem;display:grid;background:rgba(9,174,180,.10);border:1px solid rgba(9,174,180,.30);border-radius:12px}
.hero .hero-quick li{display:grid;gap:.2rem;padding:.6rem 0;border-bottom:1px solid rgba(238,248,248,.12)}
.hero .hero-quick li:last-child{border-bottom:none}
.hero .hq-head{display:flex;justify-content:space-between;align-items:baseline;gap:.75rem}
.hero .hq-name{color:#eef8f8!important;font-weight:700;font-size:.95rem;line-height:1.3;min-width:0}
.hero .hq-price{font-family:var(--font-display)!important;font-size:1.15rem!important;font-weight:600!important;color:#eef8f8!important;white-space:nowrap;font-variant-numeric:lining-nums;letter-spacing:0!important}
.hero .hq-desc{color:rgba(238,248,248,.78)!important;font-size:.9rem;line-height:1.45}
.hero .hq-terms{color:#7fe3e6!important;font-size:.8rem;font-weight:600;letter-spacing:.01em;line-height:1.35}
.hero .hero-group-label + .hero-offer--desc{margin-top:0!important;border-top:none!important;padding-top:0!important}
.hero .hero-quick-link{margin:.85rem 0 0}
.hero .hero-quick-link a{font-size:.85rem!important}
.addon-card .addon-inline-link{color:var(--tws-ink);font-weight:700;text-decoration:underline;text-underline-offset:3px}
.addon-card .addon-inline-link:hover{color:var(--tws-accent)}
@media (max-width:520px){
.hero .hero-offer--desc{gap:0!important}
.hero .hero-offer--desc li{padding:.55rem 0!important}
.hero .hero-offer--desc .tier-desc{display:none}
.hero .hero-studio h2{font-size:1.2rem!important}
}
.hero .hero-offer--desc .tier-head{width:100%;flex:1 1 auto}
.hero .hero-offer--desc li,.hero .hero-quick li{grid-template-columns:minmax(0,1fr)}
/* v2: hero aside is a compact price board at all widths; full package descriptions stay in #services cards */
.hero .hero-offer--desc{gap:0!important}
.hero .hero-offer--desc li{padding:.6rem 0!important}
.hero .hero-offer--desc .tier-desc{display:none}
.hero .hero-offer--desc .tier-head{align-items:center}

/* prices 2026-10-12 */
@media (min-width:900px){.offer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.package-grid.package-grid--two{grid-template-columns:repeat(2,1fr)}}
.offer-card--featured{outline:2px solid #09aeb4;outline-offset:-2px}
.offer-price small{font-size:.55em;font-weight:600;margin-left:.35em;color:#0a7f84;white-space:nowrap}

/* Fallback: keep add-on icons small even if the main stylesheet fails to load */
.addon-icon{width:2.25rem;height:2.25rem;max-width:2.25rem;flex:none}
.site-refresh>.offer-desc{margin:-.5rem 0 1.25rem;max-width:62ch}
.site-refresh .offer-terms{grid-template-columns:auto minmax(0,1fr)}
.site-refresh .offer-terms strong{white-space:nowrap}
.portfolio-card>a:first-child{position:relative}
.work-badge--live{background:#0a7f84!important;color:#fff!important}
.work-links{display:flex;flex-wrap:wrap;gap:.6rem 1.5rem;align-items:center}
.work-links a{min-height:44px;display:inline-flex;align-items:center}
@media (max-width:700px){.work-heading h2 br{display:none}}
.portfolio-card .work-badge{position:static;display:inline-block;margin:0 0 12px}