/* IRENE Cleaning & Facility Services - brand colours sampled from the official logo */
:root {
  --pink: #E477AB;
  --orange: #E2582A;
  --orange-deep: #BF4519;   /* accessible on white for text and buttons */
  --ink: #372F30;
  --ink-soft: #62585A;
  --cream: #FFF6F1;
  --blush: #FDEDF3;
  --line: #EFDFD8;
  --white: #fff;
  --grad: linear-gradient(90deg, var(--pink), var(--orange));
  --radius: 14px;
  --shadow: 0 10px 30px rgba(55, 47, 48, .08);
  --display: "Montserrat", "Helvetica Neue", Arial, sans-serif;
  --body: "Quicksand", "Helvetica Neue", Arial, sans-serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; font-family: var(--body); font-weight: 500; font-size: 1.0625rem; line-height: 1.65; color: var(--ink); background: var(--white); }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--orange-deep); text-underline-offset: 3px; }
a:hover { color: var(--ink); }
:focus-visible { outline: 3px solid var(--pink); outline-offset: 2px; border-radius: 4px; }
h1, h2, h3 { font-family: var(--display); line-height: 1.15; margin: 0 0 .6em; text-wrap: balance; }
h1 { font-size: clamp(2rem, 4.6vw, 3.25rem); font-weight: 800; letter-spacing: -.01em; }
h2 { font-size: clamp(1.5rem, 2.8vw, 2.1rem); font-weight: 800; }
h3 { font-size: 1.15rem; font-weight: 700; }
p { margin: 0 0 1.1em; }
.wrap { width: min(1160px, 100% - 2.5rem); margin-inline: auto; }
.wrap.narrow { width: min(820px, 100% - 2.5rem); }
.skip { position: absolute; left: -999px; top: 0; background: var(--ink); color: #fff; padding: .6rem 1rem; z-index: 100; }
.skip:focus { left: 0; }

/* buttons */
.btn { display: inline-block; font-family: var(--display); font-weight: 700; font-size: .95rem; letter-spacing: .02em; padding: .85rem 1.5rem; border-radius: 999px; border: 2px solid var(--orange-deep); background: var(--orange-deep); color: #fff; text-decoration: none; cursor: pointer; transition: transform .15s, box-shadow .15s, background .15s; }
.btn:hover { background: var(--pink); border-color: var(--pink); color: var(--ink); transform: translateY(-1px); box-shadow: var(--shadow); }
.btn.small { padding: .55rem 1.1rem; font-size: .85rem; }
.btn.outline { background: transparent; color: var(--orange-deep); }
.btn.outline:hover { background: var(--orange-deep); border-color: var(--orange-deep); color: #fff; }
.btn.light { background: #fff; border-color: #fff; color: var(--orange-deep); }
.btn.light:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.ghost { background: transparent; border-color: #fff; color: #fff; }
.btn.ghost:hover { background: #fff; color: var(--orange-deep); border-color: #fff; }
.actions { display: flex; flex-wrap: wrap; gap: .75rem; margin: 1.5rem 0 0; }

/* top bar + header */
.topbar { background: var(--ink); color: #fff; font-size: .85rem; }
.topbar .wrap { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding-block: .45rem; }
.topbar a { color: #fff; text-decoration: none; margin-left: 1.25rem; }
.topbar a:hover { text-decoration: underline; }
.top-phone { font-weight: 700; }
.site-header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid var(--line); }
.site-header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.logo img { width: auto; height: 112px; margin-block: .4rem; }
.site-nav { display: flex; align-items: center; gap: 1rem; }
.menu, .menu ul { list-style: none; margin: 0; padding: 0; }
.menu { display: flex; gap: .15rem; }
.menu > li { position: relative; }
.menu > li > a { display: block; padding: 1.9rem .7rem; font-family: var(--display); font-weight: 600; font-size: .9rem; color: var(--ink); text-decoration: none; white-space: nowrap; }
.menu > li > a:hover, .menu > li.active > a { color: var(--orange-deep); }
.menu > li.active > a { box-shadow: inset 0 -3px 0 var(--orange); }
.sub-toggle { display: none; }
.sub { position: absolute; left: 0; top: 100%; min-width: 260px; background: #fff; border: 1px solid var(--line); border-top: 3px solid transparent; border-image: var(--grad) 1; box-shadow: var(--shadow); padding: .6rem; opacity: 0; visibility: hidden; transform: translateY(6px); transition: .15s; }
.sub.wide { columns: 2; min-width: 520px; }
.menu > li:hover > .sub, .menu > li:focus-within > .sub { opacity: 1; visibility: visible; transform: none; }
.sub a { display: block; padding: .45rem .7rem; border-radius: 8px; color: var(--ink); text-decoration: none; font-size: .95rem; break-inside: avoid; }
.sub a:hover { background: var(--cream); color: var(--orange-deep); }
.nav-toggle { display: none; background: none; border: 0; padding: .6rem; cursor: pointer; }
.nav-toggle span { display: block; width: 26px; height: 3px; background: var(--ink); margin: 5px 0; border-radius: 2px; }

/* hero */
.hero { position: relative; overflow: hidden; background: linear-gradient(135deg, var(--blush), var(--cream)); padding: clamp(2.5rem, 6vw, 4.5rem) 0; }
.hero::before, .hero::after { content: ""; position: absolute; border-radius: 50%; background: var(--grad); opacity: .16; pointer-events: none; }
.hero::before { width: 420px; height: 420px; right: -120px; top: -160px; }
.hero::after { width: 220px; height: 220px; right: 18%; bottom: -130px; opacity: .1; }
.hero .wrap { position: relative; z-index: 1; }
.hero h1 { max-width: 20ch; }
.hero-home h1 { font-size: clamp(2.4rem, 6vw, 4.25rem); font-style: italic; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; padding-right: .1em; }
.hero-home { padding-block: clamp(3.5rem, 9vw, 6.5rem); }
.lead { font-size: clamp(1.1rem, 1.6vw, 1.3rem); max-width: 60ch; color: var(--ink-soft); }
.eyebrow { font-family: var(--display); font-weight: 700; font-size: .8rem; letter-spacing: .22em; text-transform: uppercase; color: var(--orange-deep); margin-bottom: .8rem; }
.crumbs { font-size: .85rem; margin-bottom: 1.25rem; color: var(--ink-soft); }
.crumbs a { color: var(--ink-soft); }
.crumbs span { margin-inline: .2rem; }

/* sections */
.section { padding: clamp(2.75rem, 6vw, 4.5rem) 0; }
.section.tint { background: var(--cream); }
.section h2 { position: relative; padding-bottom: .55em; }
.section h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: 64px; height: 4px; border-radius: 4px; background: var(--grad); }
.section h3 { margin-top: 1.6em; }
.checks { list-style: none; padding: 0; margin: 0 0 1.4em; display: grid; gap: .55rem 1.5rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.checks li { position: relative; padding-left: 1.9rem; }
.checks li::before { content: ""; position: absolute; left: 0; top: .32em; width: 1.15rem; height: 1.15rem; border-radius: 50%; background: var(--grad); }
.checks li::after { content: ""; position: absolute; left: .4rem; top: .52em; width: .3rem; height: .55rem; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.card-grid { display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); margin-top: 1.5rem; }
.card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; box-shadow: var(--shadow); position: relative; overflow: hidden; }
.card::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--grad); }
.card h3 { margin-top: 0; }
.card p:last-child, .card ul:last-child { margin-bottom: 0; }
.card .checks { grid-template-columns: 1fr; }
.link-card { display: flex; flex-direction: column; color: var(--ink); text-decoration: none; transition: transform .15s, box-shadow .15s; }
.link-card:hover { transform: translateY(-3px); box-shadow: 0 16px 36px rgba(55, 47, 48, .14); color: var(--ink); }
.link-card p { color: var(--ink-soft); font-size: .98rem; flex: 1; }
.link-card .more { font-family: var(--display); font-weight: 700; font-size: .85rem; color: var(--orange-deep); margin-top: 1rem; }
.link-card .more::after { content: " \2192"; }
.steps { list-style: none; counter-reset: step; padding: 0; margin: 1.5rem 0 0; display: grid; gap: 1.25rem; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.steps li { counter-increment: step; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; box-shadow: var(--shadow); }
.steps li::before { content: counter(step); display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: var(--grad); color: #fff; font-family: var(--display); font-weight: 800; margin-bottom: 1rem; }
.steps h3 { margin-top: 0; }
.steps p:last-child { margin-bottom: 0; }
.faq { border: 1px solid var(--line); border-radius: var(--radius); background: #fff; margin-bottom: .75rem; }
.faq summary { cursor: pointer; list-style: none; padding: 1.1rem 3rem 1.1rem 1.25rem; font-family: var(--display); font-weight: 700; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 1.25rem; top: 50%; transform: translateY(-50%); font-size: 1.5rem; color: var(--orange-deep); }
.faq[open] summary::after { content: "\2212"; }
.faq > div { padding: 0 1.25rem 1.1rem; }
.faq > div > :last-child { margin-bottom: 0; }
.chips { list-style: none; padding: 0; margin: 1rem 0 0; display: flex; flex-wrap: wrap; gap: .6rem; }
.chips li, .chips.links a { display: block; padding: .45rem 1rem; border-radius: 999px; background: #fff; border: 1px solid var(--line); font-weight: 600; font-size: .95rem; }
.chips.links li { padding: 0; border: 0; background: none; }
.chips.links a { color: var(--ink); text-decoration: none; }
.chips.links a:hover { border-color: var(--orange); color: var(--orange-deep); }
.related { background: var(--blush); }
.contact-card { background: var(--cream); border-radius: var(--radius); padding: 1.75rem; margin-bottom: 2rem; }
.contact-card h2 { font-size: 1.3rem; padding: 0; }
.contact-card h2::after { display: none; }
.sitemap ul { list-style: none; padding-left: 1.25rem; margin: .3rem 0; border-left: 2px solid var(--line); }
.sitemap > ul { padding-left: 0; border: 0; }
.sitemap > ul > li { font-family: var(--display); font-weight: 700; margin-top: 1rem; }
.sitemap ul ul li { font-family: var(--body); font-weight: 500; margin-top: .3rem; }

/* forms */
.form { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(1.25rem, 4vw, 2.25rem); }
.form h2 { padding: 0; }
.form h2::after { display: none; }
.fields { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.1rem 1.25rem; margin-bottom: 1.5rem; }
.field.wide, .legend { grid-column: 1 / -1; }
.legend { margin: 1rem 0 0; padding-top: 1.25rem; border-top: 1px solid var(--line); color: var(--orange-deep); }
.field label, fieldset legend { display: block; font-weight: 700; margin-bottom: .35rem; padding: 0; }
fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
input[type=text], input[type=tel], input[type=email], input[type=number], input[type=password], input[type=search], select, textarea { width: 100%; font: inherit; color: var(--ink); padding: .75rem .9rem; border: 1.5px solid #D9C7C0; border-radius: 10px; background: #fff; }
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(228, 119, 171, .3); }
.choices { display: flex; flex-wrap: wrap; gap: .5rem; }
.choice { display: inline-flex; align-items: center; gap: .45rem; padding: .5rem .9rem; border: 1.5px solid #D9C7C0; border-radius: 999px; cursor: pointer; font-size: .95rem; }
.choice:has(input:checked) { border-color: var(--orange-deep); background: var(--cream); }
.choice input { accent-color: var(--orange-deep); }
.consent .choice { display: flex; align-items: flex-start; gap: .7rem; border-radius: 12px; padding: .85rem 1rem; font-size: .9rem; line-height: 1.5; }
.consent .choice input { margin-top: .25rem; flex: none; width: 1.1rem; height: 1.1rem; }
.req { color: var(--orange-deep); }
.form-note { background: var(--blush); border-radius: 10px; padding: .9rem 1rem; font-weight: 600; }
.field.invalid input, .field.invalid select, .field.invalid textarea { border-color: #B3261E; }

/* CTA band + footer */
.cta-band { background: var(--grad); color: #fff; padding: clamp(2.75rem, 6vw, 4rem) 0; text-align: center; }
.cta-band h2 { color: #fff; text-shadow: 0 1px 2px rgba(55, 47, 48, .25); }
.cta-band p { font-size: 1.15rem; font-weight: 600; text-shadow: 0 1px 2px rgba(55, 47, 48, .25); }
.cta-band .actions { justify-content: center; }
.site-footer { background: var(--ink); color: #E9E1E0; padding: 3.5rem 0 0; font-size: .97rem; }
.footer-grid { display: grid; gap: 2rem; grid-template-columns: 1.3fr 1fr 1fr 1fr; }
.site-footer h2 { font-size: .8rem; letter-spacing: .2em; text-transform: uppercase; color: #fff; }
.site-footer ul { list-style: none; padding: 0; margin: 0; }
.site-footer li { margin-bottom: .4rem; }
.site-footer a { color: #E9E1E0; text-decoration: none; }
.site-footer a:hover { color: #fff; text-decoration: underline; }
.site-footer .btn { color: #fff; }
.wordmark { font-family: var(--display); font-weight: 800; font-style: italic; font-size: 2.4rem; line-height: 1; margin: 0; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; display: inline-block; padding-right: .1em; }
.wordmark-sub { font-family: var(--display); font-weight: 600; font-size: .7rem; letter-spacing: .28em; text-transform: uppercase; color: #fff; margin: .5rem 0 .3rem; }
.footer-tag { color: #F2A98C; font-weight: 600; }
.legal { border-top: 1px solid rgba(255, 255, 255, .15); margin-top: 2.5rem; padding-block: 1.25rem; font-size: .85rem; }
.legal p { margin: 0; }

/* responsive */
@media (max-width: 1200px) {
  .nav-toggle { display: block; }
  .site-nav { position: absolute; left: 0; right: 0; top: 100%; background: #fff; border-bottom: 1px solid var(--line); box-shadow: var(--shadow); flex-direction: column; align-items: stretch; padding: 1rem 1.25rem 1.5rem; display: none; max-height: calc(100vh - 90px); overflow-y: auto; }
  .site-nav.open { display: flex; }
  .menu { flex-direction: column; }
  .menu > li { border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 1fr auto; }
  .menu > li > a { padding: .9rem 0; font-size: 1rem; }
  .menu > li.active > a { box-shadow: none; }
  .sub-toggle { display: block; background: none; border: 0; width: 3rem; cursor: pointer; }
  .sub-toggle::before { content: "+"; font-size: 1.5rem; color: var(--orange-deep); }
  .sub-toggle[aria-expanded=true]::before { content: "\2212"; }
  .sub, .sub.wide { position: static; grid-column: 1 / -1; columns: 1; min-width: 0; opacity: 1; visibility: visible; transform: none; border: 0; box-shadow: none; padding: 0 0 .75rem; display: none; }
  .sub.open { display: block; }
  .site-nav > .btn { margin-top: 1rem; text-align: center; }
  .logo img { height: 88px; }
}
@media (max-width: 760px) {
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .fields { grid-template-columns: 1fr; }
  .topbar .wrap > span:first-child { display: none; }
  .topbar .wrap { justify-content: flex-end; }
  .topbar a { margin-left: .9rem; }
}
@media (max-width: 480px) { .footer-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

/* home hero: rotating photos faded into the brand background, with floating sparkles */
.hero-home { background: var(--cream); }
.hero-slides, .hero-slides .slide, .sparkles { position: absolute; inset: 0; }
.hero-slides .slide { background: right center / cover no-repeat; opacity: 0; transform: scale(1); transition: opacity 1.6s ease, transform 9s linear; }
.hero-slides .slide.on { opacity: 1; transform: scale(1.06); }
.hero-home::before { inset: 0; width: auto; height: auto; border-radius: 0; opacity: 1; z-index: 1;
  background: linear-gradient(90deg, var(--blush) 0%, var(--blush) 34%, rgba(253, 237, 243, .82) 50%, rgba(255, 246, 241, .3) 74%, rgba(255, 246, 241, 0) 100%); }
.hero-home::after { display: none; }
.hero-home .wrap { z-index: 3; }
.hero-home .wrap > * { max-width: 34rem; }
.sparkles { z-index: 2; overflow: hidden; pointer-events: none; }
.sparkle { position: absolute; width: var(--s); height: var(--s); background: var(--c); opacity: 0;
  clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%);
  animation: sparkle-float var(--d) ease-in-out var(--delay) infinite; }
@keyframes sparkle-float {
  0% { opacity: 0; transform: translate(0, 0) scale(.3) rotate(0deg); }
  20% { opacity: var(--o); transform: translate(calc(var(--x) * .2), -14px) scale(1) rotate(40deg); }
  50% { opacity: calc(var(--o) * .45); transform: translate(calc(var(--x) * .55), -42px) scale(.7) rotate(100deg); }
  75% { opacity: var(--o); transform: translate(calc(var(--x) * .8), -66px) scale(1.05) rotate(150deg); }
  100% { opacity: 0; transform: translate(var(--x), -96px) scale(.3) rotate(200deg); }
}
.hero-dots { display: flex; gap: .5rem; margin-top: 2rem; }
.hero-dots button { width: 2rem; height: .35rem; padding: 0; border: 0; border-radius: 4px; background: rgba(55, 47, 48, .22); cursor: pointer; transition: background .3s, width .3s; }
.hero-dots button[aria-current=true] { width: 3rem; background: var(--grad); }
@media (max-width: 900px) {
  .hero-home::before { background: linear-gradient(180deg, rgba(253, 237, 243, .95) 0%, rgba(253, 237, 243, .86) 55%, rgba(255, 246, 241, .6) 100%); }
  .hero-slides .slide { background-position: center; }
}
@media (prefers-reduced-motion: reduce) { .sparkles { display: none; } .hero-slides .slide.on { transform: none; } }

/* photos: beside text sections, and in rows */
.split-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.split-grid.flip .photo { order: -1; }
.split-text .checks { grid-template-columns: 1fr; }
.split-text > :last-child { margin-bottom: 0; }
.photo { margin: 0; position: relative; }
.photo::before { content: ""; position: absolute; inset: 16px -14px -14px 16px; border-radius: 20px; background: var(--grad); opacity: .28; }
.split-grid.flip .photo::before { inset: 16px 16px -14px -14px; }
.photo img, .photo .ph { position: relative; display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 20px; box-shadow: var(--shadow); }
.photo-strip { padding-top: 0; }
.section.tint + .photo-strip, .section.split + .photo-strip { padding-top: clamp(2.75rem, 6vw, 4.5rem); }
.photo-row { display: grid; gap: 2rem; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.photo-row .photo::before { inset: 12px -10px -10px 12px; }
.photo.missing .ph { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .4rem; padding: 1.25rem; text-align: center; background: var(--blush); border: 2px dashed var(--pink); box-shadow: none; color: var(--ink-soft); font-size: .92rem; }
.photo.missing strong { font-family: var(--display); color: var(--orange-deep); text-transform: uppercase; letter-spacing: .12em; font-size: .78rem; }
.photo.missing code { font-size: .95rem; font-weight: 700; color: var(--ink); background: #fff; padding: .15rem .55rem; border-radius: 6px; }
@media (max-width: 860px) {
  .split-grid { grid-template-columns: 1fr; }
  .split-grid.flip .photo { order: 0; }
  .photo::before, .split-grid.flip .photo::before { inset: 12px -8px -10px 12px; }
}
.photo-row .photo:only-child img, .photo-row .photo:only-child .ph { aspect-ratio: 21 / 8; }
@media (max-width: 860px) { .photo-row .photo:only-child img, .photo-row .photo:only-child .ph { aspect-ratio: 4 / 3; } }
/* van slide: shift right so the logo on the van sits clear of the headline */
.hero-slides .slide-hero-van { background-position: right -13vw center; }
@media (max-width: 900px) { .hero-slides .slide-hero-van { background-position: 71% center; } }
.site-nav > .btn { white-space: nowrap; flex-shrink: 0; }
/* home hero text sits a little higher: less space above, the same amount more below */
.hero-home { padding-top: clamp(2rem, 6.5vw, 4.75rem); padding-bottom: clamp(5rem, 11.5vw, 8.25rem); }

/* interior pages: a photo faded into the header from the right */
.hero.has-photo { background: var(--cream); }
.hero-bg { position: absolute; inset: 0; background: right center / cover no-repeat; }
.hero.has-photo::before { inset: 0; width: auto; height: auto; border-radius: 0; opacity: 1; z-index: 1;
  background: linear-gradient(90deg, var(--blush) 0%, var(--blush) 36%, rgba(253, 237, 243, .86) 52%, rgba(255, 246, 241, .42) 76%, rgba(255, 246, 241, .18) 100%); }
.hero.has-photo::after { display: none; }
.hero.has-photo .wrap { z-index: 2; }
.hero.has-photo .lead { max-width: 34rem; color: var(--ink); }
.hero.has-photo { padding-block: clamp(3rem, 7vw, 5.5rem); }
@media (max-width: 900px) {
  .hero.has-photo::before { background: linear-gradient(180deg, rgba(253, 237, 243, .95) 0%, rgba(253, 237, 243, .88) 60%, rgba(255, 246, 241, .72) 100%); }
  .hero-bg { background-position: center; }
}

/* extra call-to-action buttons */
.actions.center { justify-content: center; margin-top: 2.25rem; }
.split-text .actions, .faq + .actions { margin-top: 1.5rem; }
.mobile-cta { display: none; }
@media (max-width: 760px) {
  .mobile-cta { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; position: fixed; left: 0; right: 0; bottom: 0; z-index: 60; padding: .6rem .75rem calc(.6rem + env(safe-area-inset-bottom)); background: #fff; border-top: 1px solid var(--line); box-shadow: 0 -6px 20px rgba(55, 47, 48, .1); }
  .mobile-cta .btn { text-align: center; padding-inline: .5rem; white-space: nowrap; }
  .mobile-cta .btn.outline { background: #fff; }
  body:has(.mobile-cta) { padding-bottom: 4.25rem; }
}

/* photo at the top of each link card */
.card-img { display: block; width: calc(100% + 3rem); max-width: none; margin: -1.5rem -1.5rem 1.25rem; aspect-ratio: 16 / 10; object-fit: cover; }

/* never more than three blocks in a row */
.card-grid, .steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.steps:has(> li:nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 900px) { .card-grid, .steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .card-grid, .steps, .steps:has(> li:nth-child(4):last-child) { grid-template-columns: 1fr; } }

/* footer button turns brand pink on hover */
.site-footer .btn:hover, .site-footer .btn:focus-visible { background: var(--pink); border-color: var(--pink); color: var(--ink); text-decoration: none; }

/* top bar: on phones keep only the phone number, Sign Up and Account Login */
@media (max-width: 760px) { .topbar a.opt { display: none; } .topbar { font-size: .8rem; } }

/* footer services list: Residential and Commercial group labels */
.site-footer .foot-sub { margin-top: 1rem; font-family: var(--display); font-weight: 700; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; }
.site-footer .foot-sub:first-child { margin-top: 0; }
.site-footer .foot-sub a { color: #F2A98C; }

/* quote wizard */
.wizard { max-width: 980px; margin-inline: auto; }
.wizard h2 { text-align: center; font-size: clamp(1.35rem, 2.6vw, 1.9rem); margin: 0 auto 1.75rem; max-width: 30ch; }
.wiz-progress { list-style: none; margin: 0 0 2.5rem; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); position: relative; }
.wiz-progress::before { content: ""; position: absolute; left: 10%; right: 10%; top: 1.5rem; height: 3px; background: var(--grad); }
.wiz-progress li { position: relative; text-align: center; }
.wiz-dot { width: 3rem; height: 3rem; border: 3px solid var(--orange-deep); background: #fff; color: var(--orange-deep); font-family: var(--display); font-weight: 800; font-size: 1.25rem; border-radius: 10px; cursor: pointer; padding: 0; transition: background .15s, color .15s; }
.wiz-dot:disabled { cursor: default; border-color: #D9C7C0; color: #B9A7A0; }
.wiz-dot.done { background: var(--blush); }
.wiz-dot.current { background: var(--grad); border-color: transparent; color: #fff; }
.wiz-progress em { display: block; margin-top: .5rem; font-style: normal; font-family: var(--display); font-weight: 700; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; color: var(--orange-deep); }
.wiz-q { margin: 0 0 1.75rem; }
.wiz-q > legend, .wiz-intro { font-size: 1.15rem; font-weight: 600; text-align: center; width: 100%; margin-bottom: 1.1rem; }
.wiz-q .choices { justify-content: center; }
.choices.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; }
.choices.two-col .choice { border-radius: 12px; }
.tiles { display: grid; gap: 1rem; max-width: 640px; margin-inline: auto; }
.tiles.cols-3 { grid-template-columns: repeat(3, 1fr); }
.tiles.cols-2 { grid-template-columns: repeat(2, 1fr); max-width: 520px; }
.tile { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .5rem; text-align: center; padding: 1.4rem .75rem; min-height: 9.5rem; border: 3px solid var(--orange-deep); border-radius: var(--radius); color: var(--orange-deep); background: #fff; cursor: pointer; transition: background .15s, color .15s, transform .15s; }
.tile:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.tile input { position: absolute; opacity: 0; pointer-events: none; }
.tile-label { font-family: var(--display); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.tile-hint { font-size: .85rem; color: var(--ink-soft); line-height: 1.3; }
.tile:has(input:checked) { background: var(--grad); border-color: transparent; color: #fff; }
.tile:has(input:checked) .tile-label, .tile:has(input:checked) .tile-hint { color: #fff; }
.tile:has(input:focus-visible) { outline: 3px solid var(--pink); outline-offset: 3px; }
.wiz-q.invalid > legend { color: #B3261E; }
.wiz-required { font-size: .9rem; color: var(--ink-soft); margin: 0 0 1rem; }
.wiz-consent { font-size: .9rem; color: var(--ink-soft); text-align: center; max-width: 46ch; margin-inline: auto; }
.wiz-nav { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .75rem; margin-top: 1rem; }
.wiz-pct { font-size: .9rem; color: var(--ink-soft); }
.thanks-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem; max-width: 560px; }
.thanks-links .btn { text-align: center; }
.preview-note { background: var(--blush); border: 1px dashed var(--pink); border-radius: 10px; padding: .8rem 1rem; font-weight: 600; max-width: 560px; }
@media (max-width: 600px) {
  .tiles.cols-3 { grid-template-columns: repeat(2, 1fr); }
  .wiz-progress em { font-size: .58rem; letter-spacing: .02em; }
  .wiz-dot { width: 2.5rem; height: 2.5rem; font-size: 1.05rem; }
  .wiz-progress::before { top: 1.25rem; }
  .choices.two-col, .thanks-links { grid-template-columns: 1fr; }
}

[hidden] { display: none !important; }
.tiles.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.tiles.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 600px) {
  .tiles.cols-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .tiles { gap: .7rem; }
  .tile { padding: 1rem .4rem; min-height: 8rem; }
  .tile-label { font-size: .8rem; letter-spacing: .03em; overflow-wrap: anywhere; }
}

/* leadership team (About page) */
.section.dark { background: #1E191A; color: #fff; text-align: center; }
.section.dark h2 { color: #fff; text-transform: uppercase; letter-spacing: .02em; }
.section.dark h2::after { left: 50%; transform: translateX(-50%); }
.section.dark > .wrap > p { max-width: 62ch; margin-inline: auto; color: #E9E1E0; font-size: 1.1rem; }
.team-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6.5rem 1.75rem; margin-top: 7rem; }
.team-card { background: #3A3335; border-radius: var(--radius); padding: 0 1.25rem 2rem; }
.team-card .avatar { width: 150px; height: 150px; margin: -75px auto 1.25rem; border-radius: 50%; overflow: hidden; background: var(--grad); display: grid; place-items: center; border: 5px solid #1E191A; }
.team-card .avatar img { width: 100%; height: 100%; object-fit: cover; }
.team-card .avatar span { font-family: var(--display); font-weight: 800; font-size: 2.6rem; color: #fff; letter-spacing: .02em; }
.team-card h3 { margin: 0 0 .5rem; font-size: 1.35rem; text-transform: uppercase; letter-spacing: .03em; color: #fff; }
.team-card p { margin: 0; font-family: var(--display); font-weight: 700; font-size: .8rem; letter-spacing: .08em; text-transform: uppercase; color: #F2A98C; }
.team-card.open .avatar { background: #1E191A; border-color: #F2A98C; border-style: dashed; border-width: 3px; }
.team-card.open .avatar span { color: #F2A98C; font-size: 3rem; }
.team-card.open h3 { color: #E9E1E0; }
.team-card.open .btn { margin-top: 1.1rem; }
@media (max-width: 900px) { .team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .team-grid { grid-template-columns: 1fr; } }
.team-card .avatar img { object-position: center 22%; }

/* Torrey's headshot: zoomed out a little to show more of the blazer; the side slivers match the photo's grey backdrop */
.p-torrey-c-harris .avatar { background: linear-gradient(180deg, #6B6A6E, #838287 60%, #7F7E84); }
.p-torrey-c-harris .avatar img { width: 92%; height: auto; align-self: start; margin-top: -4%; }
.p-romona-bullock .avatar img { object-position: center top; }
.p-shelia-bullock .avatar img { object-position: center top; }

.legal .team-link { float: right; color: #E9E1E0; }

/* footer: app badges and social icons */
.store-badges { display: flex; flex-direction: column; align-items: flex-start; gap: .7rem; margin: 1.5rem 0 1.4rem; }
.site-footer .store-badge { display: inline-flex; align-items: center; gap: .6rem; min-width: 190px; padding: .5rem 1rem .55rem .8rem; border: 1.5px solid rgba(255, 255, 255, .55); border-radius: 10px; color: #fff; line-height: 1.1; font-family: var(--display); font-weight: 700; font-size: 1.15rem; text-decoration: none; }
.site-footer .store-badge small { display: block; font-family: var(--body); font-weight: 500; font-size: .7rem; letter-spacing: .02em; margin-bottom: .1rem; }
.site-footer .store-badge:hover { background: var(--pink); border-color: var(--pink); color: var(--ink); text-decoration: none; }
.social { display: flex; gap: 1rem; align-items: center; }
.site-footer .social a { color: #E9E1E0; display: inline-flex; }
.site-footer .social a:hover { color: var(--pink); }
/* footer badges and social icons, 20% smaller */
.store-badges { gap: .56rem; margin: 1.2rem 0 1.1rem; }
.site-footer .store-badge { gap: .48rem; min-width: 152px; padding: .4rem .8rem .44rem .64rem; border-radius: 8px; font-size: .92rem; }
.site-footer .store-badge small { font-size: .56rem; }
.site-footer .store-badge svg, .site-footer .social svg { width: 21px; height: 21px; }
.social { gap: .8rem; }

.legal .legal-links a { color: #E9E1E0; text-decoration: underline; }

/* home page pop-up */
.promo { position: fixed; inset: 0; z-index: 200; display: grid; place-items: center; padding: 1.25rem; background: rgba(55, 47, 48, .62); animation: promo-fade .3s ease; }
.promo-box { position: relative; display: grid; grid-template-columns: 1fr 1.15fr; width: min(900px, 100%); min-height: min(520px, 80vh); background: #fff; border-radius: 18px; box-shadow: 0 30px 80px rgba(0, 0, 0, .35); animation: promo-rise .35s ease; }
.promo-text { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 1.5rem; padding: clamp(1.75rem, 4vw, 3rem); }
.promo-text h2 { font-size: clamp(1.8rem, 3.6vw, 2.6rem); font-style: italic; line-height: 1.1; margin: 0; padding: 0 .1em; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.promo-text p { margin: 0; font-size: 1.15rem; font-weight: 600; max-width: 24ch; }
.promo-photo { background: center / cover no-repeat; border-radius: 0 18px 18px 0; min-height: 220px; }
.promo-close { position: absolute; top: -14px; right: -14px; z-index: 1; width: 40px; height: 40px; border-radius: 50%; border: 3px solid #fff; background: var(--orange-deep); color: #fff; font-size: 1.5rem; line-height: 1; cursor: pointer; display: grid; place-items: center; padding: 0 0 2px; }
.promo-close:hover { background: var(--pink); color: var(--ink); }
@keyframes promo-fade { from { opacity: 0; } }
@keyframes promo-rise { from { opacity: 0; transform: translateY(18px) scale(.98); } }
@media (max-width: 700px) {
  .promo-box { grid-template-columns: 1fr; min-height: 0; max-height: 92vh; overflow: auto; }
  .promo-photo { order: -1; border-radius: 18px 18px 0 0; min-height: 170px; }
  .promo-close { top: 8px; right: 8px; }
}

.promo-actions { display: flex; flex-direction: column; gap: .7rem; margin: 0; width: min(100%, 240px); }
.promo-actions .btn { text-align: center; }

/* careers: job search and job pages */
.job-filters { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr auto; gap: .9rem; align-items: end; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.1rem 1.25rem; }
.job-filters .field.wide { grid-column: auto; }
.job-filters .btn { white-space: nowrap; height: 2.9rem; }
.job-count { font-weight: 700; margin: 1.25rem 0 .75rem; }
.job-list { list-style: none; margin: 0; padding: 0; display: grid; gap: .7rem; }
.job { display: flex; align-items: center; justify-content: space-between; gap: 1rem; background: #fff; border: 1px solid var(--line); border-left: 5px solid var(--orange); border-radius: 12px; padding: 1rem 1.25rem; }
.job h3 { margin: 0 0 .2rem; font-size: 1.1rem; }
.job h3 a { color: var(--ink); text-decoration: none; } .job h3 a:hover { color: var(--orange-deep); text-decoration: underline; }
.job p { margin: 0; } .job-loc { font-weight: 700; color: var(--orange-deep); } .job-meta { font-size: .9rem; color: var(--ink-soft); }
.job .btn { flex: none; }
.job-pages { display: flex; flex-wrap: wrap; gap: .4rem; justify-content: center; margin-top: 1.5rem; }
.job-pages button { font: inherit; font-weight: 700; min-width: 2.6rem; padding: .5rem .8rem; border: 1.5px solid #D9C7C0; border-radius: 10px; background: #fff; color: var(--ink); cursor: pointer; }
.job-pages button[aria-current] { background: var(--grad); border-color: transparent; color: #fff; }
.job-pages button:disabled { opacity: .45; cursor: default; }
.job-details { background: var(--cream); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem 1.75rem; margin-bottom: 1rem; }
.job-details h2 { font-size: 1.2rem; padding: 0; } .job-details h2::after { display: none; }
.job-details dl { display: grid; grid-template-columns: max-content 1fr; gap: .4rem 1.5rem; margin: 0 0 1rem; }
.job-details dt { font-family: var(--display); font-weight: 700; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--orange-deep); padding-top: .2rem; }
.job-details dd { margin: 0; font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
@media (max-width: 480px) { .job-details { padding: 1.2rem 1.1rem; } .job-details dl { grid-template-columns: 1fr; gap: .1rem; } .job-details dd { margin-bottom: .5rem; } }
.job-share a { margin-right: .75rem; }
@media (max-width: 900px) { .job-filters { grid-template-columns: 1fr 1fr; } .job-filters .field.wide { grid-column: 1 / -1; } }
@media (max-width: 560px) { .job-filters { grid-template-columns: 1fr; } .job { flex-direction: column; align-items: flex-start; } }

.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* FAQ page */
.faq-tools { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.25rem 1.5rem; }
.faq-tools label { display: block; font-family: var(--display); font-weight: 700; margin-bottom: .4rem; }
.faq-tools input { font-size: 1.05rem; }
.faq-jump { margin-top: 1rem; }
.faq-none { margin: 1rem 0 0; font-weight: 600; }
.faq-group { padding-block: clamp(1.5rem, 3.5vw, 2.5rem); scroll-margin-top: 140px; }
.faq-group.tint, .faq-group { background: #fff; }
.faq-group h2 { font-size: clamp(1.25rem, 2.2vw, 1.6rem); }
.faq-group .faq { box-shadow: 0 2px 8px rgba(55, 47, 48, .04); }
.faq-group .faq[open] { border-color: var(--orange); }
.faq-group .faq[open] summary { color: var(--orange-deep); }

.rfp-options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (max-width: 600px) { .rfp-options { grid-template-columns: 1fr; } }
form.form { scroll-margin-top: 150px; }

/* Book Now page */
.booking-frame iframe { display: block; width: 100%; min-height: 1100px; border: 0; border-radius: var(--radius); background: #fff; }
.booking-soon { text-align: center; padding: 2.5rem 1.5rem; } .booking-soon h2 { padding: 0; } .booking-soon h2::after { display: none; }
.booking-soon p { max-width: 52ch; margin-inline: auto; }

.footer-btns { display: flex; flex-direction: column; align-items: flex-start; gap: .6rem; }
.footer-btns .btn { min-width: 11rem; text-align: center; }
/* footer BOOK NOW: pink, turning orange on hover (the reverse of the Get A Free Quote button above it) */
.site-footer .footer-btns .btn[href*="book"] { background: var(--pink); border-color: var(--pink); color: var(--ink); }
.site-footer .footer-btns .btn[href*="book"]:hover, .site-footer .footer-btns .btn[href*="book"]:focus-visible { background: var(--orange-deep); border-color: var(--orange-deep); color: #fff; }

/* chat button and window */
.chat-button { position: fixed; right: 22px; bottom: 22px; z-index: 150; width: 62px; height: 62px; border-radius: 50%; border: 0; background: var(--grad); color: #fff; cursor: pointer; display: grid; place-items: center; box-shadow: 0 10px 28px rgba(55, 47, 48, .3); transition: transform .15s; }
.chat-button:hover { transform: scale(1.07); }
.chat-dot { position: absolute; top: 4px; right: 4px; width: 14px; height: 14px; border-radius: 50%; background: #1F9D55; border: 2px solid #fff; }
.chat-panel { position: fixed; right: 22px; bottom: 96px; z-index: 150; width: min(370px, calc(100vw - 24px)); max-height: min(580px, calc(100vh - 120px)); display: flex; flex-direction: column; background: #fff; border-radius: 18px; box-shadow: 0 24px 60px rgba(55, 47, 48, .3); overflow: hidden; font-size: .97rem; }
.chat-panel header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .9rem 1.1rem; background: var(--grad); color: #fff; }
.chat-panel header strong { display: block; font-family: var(--display); font-size: 1.05rem; }
.chat-status { font-size: .8rem; font-weight: 600; } .chat-status.on::before { content: ""; display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #7CF5A8; margin-right: .35rem; }
.chat-close { background: none; border: 0; color: #fff; font-size: 1.7rem; line-height: 1; cursor: pointer; padding: 0 .2rem; }
.chat-body { flex: 1; overflow-y: auto; min-height: 0; }
.chat-start { padding: 1.1rem; display: grid; gap: .7rem; } .chat-start p { margin: 0; font-weight: 600; }
.chat-start label { display: grid; gap: .25rem; font-weight: 700; font-size: .88rem; }
.chat-start input, .chat-start textarea, .chat-send textarea { width: 100%; font: inherit; padding: .6rem .75rem; border: 1.5px solid #D9C7C0; border-radius: 10px; resize: none; }
.chat-log { padding: 1rem; display: flex; flex-direction: column; gap: .5rem; min-height: 240px; max-height: 360px; overflow-y: auto; background: var(--cream); }
.chat-msg { max-width: 82%; padding: .55rem .8rem; border-radius: 14px; } .chat-msg p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; }
.chat-msg.me { align-self: flex-end; background: var(--orange-deep); color: #fff; border-bottom-right-radius: 4px; }
.chat-msg.them { align-self: flex-start; background: #fff; border: 1px solid var(--line); border-bottom-left-radius: 4px; } .chat-msg span { font-size: .72rem; color: var(--ink-soft); }
.chat-send { display: flex; gap: .5rem; padding: .7rem; border-top: 1px solid var(--line); align-items: flex-end; } .chat-send textarea { flex: 1; }
.chat-note { margin: 0; padding: 0 1rem .7rem; font-size: .8rem; color: var(--ink-soft); } .chat-note:empty { display: none; }
@media (max-width: 760px) { .chat-button { bottom: 84px; right: 14px; width: 54px; height: 54px; } .chat-panel { right: 12px; bottom: 148px; max-height: calc(100vh - 170px); } }

/* footer Team Portal link: deliberately faint, so staff can find it and visitors are not drawn to it */
.legal .team-link { color: rgba(233, 225, 224, .28); text-decoration: none; }
.legal .team-link:hover, .legal .team-link:focus-visible { color: rgba(233, 225, 224, .75); }

/* footer: Team Portal sits quietly beside the legal links, clear of the chat button */
.legal .team-link { float: right; margin: 0 4.75rem 0 .9rem; }
@media (max-width: 640px) { .legal .team-link { float: none; display: block; margin: .5rem 0 0; } }

/* customer reviews carousel: two rows drifting in opposite directions */
.reviews { display: grid; gap: 1.1rem; margin-top: 1.5rem; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.review-row { overflow: hidden; }
.review-track, .review-copy { display: flex; gap: 1.1rem; width: max-content; }
.review-track { animation: review-slide 60s linear infinite; padding-block: .4rem; }
.review-row.b .review-track { animation-direction: reverse; animation-duration: 72s; }
.reviews:hover .review-track, .reviews:focus-within .review-track { animation-play-state: paused; }
@keyframes review-slide { to { transform: translateX(calc(-50% - .55rem)); } }
.review { flex: 0 0 auto; width: min(380px, 82vw); background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1.2rem 1.3rem; box-shadow: 0 4px 14px rgba(55, 47, 48, .06); }
.review header { display: flex; align-items: center; gap: .8rem; padding-bottom: .8rem; margin-bottom: .8rem; border-bottom: 1px solid var(--line); }
.review .avatar { flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; color: #fff; font-family: var(--display); font-weight: 700; font-size: 1.2rem; }
.review strong { display: block; font-family: var(--display); }
.review .stars { color: #F5B301; font-size: 1.15rem; letter-spacing: .08em; line-height: 1; } .review .stars i { color: #E3D9D3; font-style: normal; }
.review p { margin: 0; } .review .where { display: block; margin-top: .6rem; font-size: .85rem; color: var(--ink-soft); }
.review .sample { margin-left: auto; font-style: normal; font-family: var(--display); font-weight: 800; font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; background: #FFF1C9; color: #5C4500; padding: .2rem .5rem; border-radius: 6px; }
.review-note { text-align: center; font-size: .9rem; font-weight: 600; background: #FFF1C9; color: #5C4500; border-radius: 10px; padding: .6rem 1rem; max-width: 560px; margin: 1rem auto 0; }
@media (prefers-reduced-motion: reduce) { .review-track { animation: none; } .review-copy { display: none; } .review-row { overflow-x: auto; } }

/* About page: portrait of Irene, kept tall, with a soft brand-colored wash over it */
.photo-irene { max-width: 430px; margin-inline: auto; }
.photo-irene img { aspect-ratio: 4 / 5; object-position: center top; }
.photo-irene::after { content: ""; position: absolute; inset: 0; border-radius: 20px; background: var(--grad); opacity: .16; pointer-events: none; }

/* sections reached from a button stop below the sticky header */
section[id] { scroll-margin-top: 120px; }

/* home hero: "Proudly Serving <City>" line under the headline, same size as the line above it */
.hero-home .serving { margin: .9rem 0 .8rem; }

/* home hero: text and buttons nudged up slightly (about 20px on desktop); the photo keeps its height */
.hero-home { padding-top: clamp(1.5rem, 4.8vw, 3.5rem); padding-bottom: clamp(5.5rem, 13.2vw, 9.5rem); }

/* home hero: headline sits midway between the line above it and the "Proudly Serving" line below it */
.hero-home h1 { margin: .42em 0 .38em; }

/* shown until real customer reviews are added */
.review-empty { max-width: 640px; margin: 0 auto; text-align: center; font-size: 1.08rem; }

/* ---------------------------------------------------------------- online booking form (book.js) */
.bk { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: 2rem; align-items: start; text-align: left; }
.bk-sec { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.4rem 1.5rem; margin-bottom: 1.25rem; transition: opacity .2s; }
.bk-sec.bk-off { opacity: .45; pointer-events: none; }
.bk-sec h2 { font-size: 1.2rem; margin: 0 0 1rem; display: flex; align-items: center; gap: .6rem; }
.bk-sec h2 span { display: inline-grid; place-items: center; width: 2rem; height: 2rem; border-radius: 8px; background: var(--grad); color: #fff; font-size: 1rem; flex: none; }
.bk-sec h3 { font-size: 1rem; margin: 1.25rem 0 .6rem; }
.bk-row { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .75rem 1rem; }
.bk-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 1rem; }
.bk-field { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .6rem; }
.bk-field.wide { grid-column: 1 / -1; }
.bk-field label, .bk-coupon label { font-weight: 700; font-size: .92rem; }
.bk input[type=text], .bk input[type=email], .bk input[type=tel], .bk input[type=password], .bk input[type=date], .bk input:not([type]), .bk select, .bk textarea {
  font: inherit; color: var(--ink); padding: .65rem .8rem; border: 1.5px solid #D9C7C0; border-radius: 10px; background: #fff; width: 100%; }
.bk input:focus, .bk select:focus, .bk textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(228, 119, 171, .3); }
#bk-zip { max-width: 9rem; font-size: 1.15rem; letter-spacing: .08em; }
.bk-area { margin: 0 0 .7rem; }
.bk-pills { display: flex; flex-wrap: wrap; gap: .5rem; }
.bk-pill { position: relative; }
.bk-pill input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.bk-pill span { display: inline-block; padding: .55rem 1rem; border: 1.5px solid #D9C7C0; border-radius: 999px; font-weight: 600; font-size: .95rem; background: #fff; }
.bk-pill input:checked + span { border-color: transparent; background: var(--grad); color: #fff; }
.bk-pill input:focus-visible + span { box-shadow: 0 0 0 3px rgba(228, 119, 171, .45); }
.bk-about { color: #6b5d5e; margin: .8rem 0 0; }
.bk-check { display: flex; gap: .6rem; align-items: flex-start; font-size: .92rem; margin: .8rem 0; }
.bk-check input { margin-top: .2rem; width: 1.1rem; height: 1.1rem; flex: none; accent-color: var(--orange); }
.bk-small { font-size: .88rem; color: #6b5d5e; }
.bk-error, .bk-err-text { color: #B3261E; font-weight: 600; }
.bk-error { background: #FDECEA; border-radius: 10px; padding: .7rem .9rem; }
.bk-submit { width: 100%; font-size: 1.05rem; margin-top: .4rem; }
.bk-submit:disabled { opacity: .5; cursor: not-allowed; }
.bk-side { position: sticky; top: 110px; }
.bk-summary { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.3rem 1.4rem; }
.bk-summary h2 { font-size: 1.15rem; margin: 0 0 .8rem; }
.bk-lines { width: 100%; border-collapse: collapse; font-size: .92rem; margin: .4rem 0 .2rem; }
.bk-lines td { padding: .3rem 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.bk-lines td:last-child { text-align: right; white-space: nowrap; padding-left: .6rem; }
.bk-lines .bk-total td { font-weight: 800; font-family: var(--display); border-bottom: 2px solid var(--ink); }
.bk-lines .bk-due td { font-weight: 700; color: var(--orange-deep, #C2461D); }
.bk-coupon { margin-top: 1rem; }
.bk-coupon .bk-row { flex-wrap: nowrap; }
.bk-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.6rem 1.7rem; max-width: 680px; margin: 0 auto; text-align: left; }
.bk-card h2 { margin: .2rem 0 .8rem; }
.bk-eyebrow { font-family: var(--display); font-weight: 700; font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--orange-deep, #C2461D); margin: 0; }
.bk-done { text-align: center; }
@media (max-width: 900px) {
  .bk { grid-template-columns: 1fr; }
  .bk-side { position: static; }
}
@media (max-width: 560px) {
  .bk-grid { grid-template-columns: 1fr; }
  .bk-sec { padding: 1.1rem 1rem; }
}

/* service cards and extras tiles */
.bk-svcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: .75rem; }
.bk-svc { position: relative; cursor: pointer; }
.bk-svc input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.bk-svc-card { display: flex; flex-direction: column; gap: .3rem; height: 100%; padding: 1rem 1rem .9rem; border: 2px solid var(--line); border-radius: 14px; background: #fff;
  transition: border-color .15s, box-shadow .15s, transform .15s; }
.bk-svc-card strong { font-family: var(--display); font-size: 1rem; line-height: 1.25; }
.bk-svc-about { font-size: .84rem; color: #6b5d5e; line-height: 1.4; }
.bk-svc-price { margin-top: auto; padding-top: .35rem; font-weight: 700; font-size: .9rem; color: var(--orange-deep); }
.bk-svc:hover .bk-svc-card { border-color: #E9B9CB; transform: translateY(-2px); box-shadow: var(--shadow); }
.bk-svc input:checked + .bk-svc-card { border-color: var(--orange); background: linear-gradient(180deg, #FFF6F1, #fff); box-shadow: 0 0 0 3px rgba(228, 119, 171, .25); }
.bk-svc input:focus-visible + .bk-svc-card { box-shadow: 0 0 0 3px rgba(228, 119, 171, .5); }
.bk-ico { display: inline-grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 12px; background: var(--blush); color: var(--orange-deep); flex: none; }
.bk-ico svg { width: 1.45rem; height: 1.45rem; }
.bk-svc input:checked + .bk-svc-card .bk-ico, .bk-x.on .bk-ico { background: var(--grad); color: #fff; }
.bk-extras { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: .75rem; }
.bk-x { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: .35rem; padding: 1rem .75rem .9rem;
  border: 2px solid var(--line); border-radius: 14px; background: #fff; cursor: pointer; user-select: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.bk-x:hover { border-color: #E9B9CB; transform: translateY(-2px); box-shadow: var(--shadow); }
.bk-x:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(228, 119, 171, .5); }
.bk-x.on { border-color: var(--orange); background: linear-gradient(180deg, #FFF6F1, #fff); }
.bk-x-name { font-weight: 700; font-size: .92rem; line-height: 1.3; }
.bk-x-price { font-size: .85rem; color: #6b5d5e; }
.bk-x.on .bk-x-price { color: var(--orange-deep); font-weight: 700; }
.bk-x-check { position: absolute; top: .55rem; right: .55rem; width: 1.3rem; height: 1.3rem; border-radius: 50%; border: 2px solid #D9C7C0; background: #fff; }
.bk-x.on .bk-x-check { border-color: transparent; background: var(--grad); }
.bk-x.on .bk-x-check::after { content: ""; position: absolute; left: .38rem; top: .16rem; width: .3rem; height: .6rem; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); }
.bk-step { display: none; align-items: center; gap: .5rem; margin-top: .2rem; }
.bk-x.on .bk-step { display: inline-flex; }
.bk-step button { width: 1.9rem; height: 1.9rem; border-radius: 50%; border: 1.5px solid var(--orange); background: #fff; color: var(--orange-deep); font-size: 1.1rem; line-height: 1; cursor: pointer; }
.bk-step button:hover { background: var(--orange-deep); color: #fff; }
.bk-step output { min-width: 1.2rem; font-weight: 800; }
@media (max-width: 560px) { .bk-svcs { grid-template-columns: 1fr 1fr; } .bk-svc-about { display: none; } .bk-extras { grid-template-columns: 1fr 1fr; } }
#bk-access { display: grid; grid-template-columns: 1fr 1fr; gap: .6rem; margin-bottom: 1.1rem; }
#bk-access .bk-pill span { display: block; text-align: center; }
@media (max-width: 420px) { #bk-access { grid-template-columns: 1fr; } }
#bk-password { max-width: 22rem; }

/* short hero on the booking pages, so the form shows sooner */
.hero.hero-compact, .hero.has-photo.hero-compact { padding-block: clamp(1.25rem, 3vw, 2rem); }
.hero-compact h1 { font-size: clamp(1.7rem, 3.4vw, 2.4rem); margin: .2rem 0 .35rem; }
.hero-compact .lead { font-size: 1.05rem; margin: 0; }
.hero-compact .crumbs, .hero-compact nav[aria-label="Breadcrumb"] { margin-bottom: .2rem; }
.hero-compact:not(.has-photo)::before, .hero-compact::after { display: none; }

/* "app coming soon" pop-up with two phone mock-ups */
.app-soon { border: 0; border-radius: 22px; padding: 0; width: min(860px, calc(100vw - 32px)); max-height: calc(100vh - 32px); overflow: auto; box-shadow: 0 30px 80px rgba(55, 47, 48, .35); color: var(--ink); background: #fff; }
.app-soon::backdrop { background: rgba(55, 47, 48, .6); }
.app-soon[open] { display: grid; grid-template-columns: 1.05fr 1fr; }
.app-soon-x { position: absolute; top: .7rem; right: .9rem; z-index: 2; width: 2.4rem; height: 2.4rem; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .85); font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--ink); }
.app-soon-phones { position: relative; display: flex; justify-content: center; align-items: center; padding: 2.2rem 1rem; background: var(--grad); min-height: 420px; }
.app-soon-text { padding: 2.4rem 2.2rem 2rem; align-self: center; }
.app-soon-text h2 { font-size: clamp(1.7rem, 3vw, 2.3rem); margin: .2rem 0 .8rem; }
.app-soon-text .actions { margin-top: 1.4rem; display: flex; flex-wrap: wrap; gap: .6rem; }
.phone { position: relative; width: 168px; height: 340px; border-radius: 30px; background: #1d1a1b; padding: 9px; box-shadow: 0 18px 40px rgba(0, 0, 0, .3); }
.phone-ios { transform: rotate(-6deg) translateX(14px); z-index: 1; }
.phone-android { width: 162px; height: 330px; border-radius: 22px; transform: rotate(5deg) translate(-14px, 26px); }
.ph-screen { position: relative; height: 100%; border-radius: 22px; background: #FFF6F1; overflow: hidden; padding: 26px 10px 0; font-size: 9px; text-align: left; }
.phone-android .ph-screen { border-radius: 15px; }
.ph-notch { position: absolute; top: 6px; left: 50%; transform: translateX(-50%); width: 54px; height: 14px; border-radius: 10px; background: #1d1a1b; }
.ph-cam { position: absolute; top: 8px; left: 50%; transform: translateX(-50%); width: 9px; height: 9px; border-radius: 50%; background: #1d1a1b; }
.ph-bar { display: flex; justify-content: space-between; align-items: center; }
.ph-logo { font-family: var(--display); font-weight: 800; font-style: italic; font-size: 14px; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ph-dot { width: 18px; height: 18px; border-radius: 50%; background: var(--blush); border: 2px solid #fff; box-shadow: 0 0 0 1px var(--line); }
.ph-hi { font-family: var(--display); font-weight: 700; font-size: 12px; margin: 10px 0 6px; }
.ph-next { background: #fff; border-radius: 10px; padding: 8px; box-shadow: 0 3px 10px rgba(55, 47, 48, .08); display: grid; gap: 2px; }
.ph-next small { font-size: 7.5px; text-transform: uppercase; letter-spacing: .08em; color: var(--orange-deep); font-weight: 700; }
.ph-next strong { font-size: 10px; }
.ph-next span { color: #6b5d5e; }
.ph-next em { font-style: normal; font-weight: 700; color: #1F6B3A; margin-top: 2px; }
.ph-btn { margin: 9px 0; padding: 7px; border-radius: 999px; background: var(--grad); color: #fff; text-align: center; font-weight: 700; font-family: var(--display); font-size: 9px; }
.ph-tiles { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.ph-tiles span { background: #fff; border-radius: 8px; padding: 9px 6px; text-align: center; font-weight: 700; font-size: 8px; box-shadow: 0 2px 6px rgba(55, 47, 48, .06); }
.ph-nav { position: absolute; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-around; padding: 9px 8px 11px; background: #fff; border-top: 1px solid var(--line); }
.ph-nav i { width: 14px; height: 14px; border-radius: 4px; background: var(--blush); }
.ph-nav i:first-child { background: var(--grad); }
@media (max-width: 680px) {
  .app-soon[open] { grid-template-columns: 1fr; }
  .app-soon-phones { min-height: 300px; padding: 1.4rem .5rem 2rem; }
  .phone { transform: scale(.78) rotate(-6deg) translateX(14px); margin: -30px -12px; }
  .phone-android { transform: scale(.78) rotate(5deg) translate(-14px, 26px); }
  .app-soon-text { padding: 1.4rem 1.3rem 1.6rem; }
}
.site-footer .app-soon h2, .site-footer .app-soon p { color: var(--ink); }
.site-footer .app-soon .eyebrow { color: var(--orange-deep); }
.site-footer .app-soon .muted { color: #6b5d5e; }
.site-footer .app-soon .btn.outline { background: #fff; color: var(--orange-deep); border-color: var(--orange-deep); }
.site-footer .app-soon .btn:not(.outline) { color: #fff; }
.site-footer .app-soon h2 { text-transform: none; letter-spacing: 0; font-size: clamp(1.7rem, 3vw, 2.3rem); margin: .2rem 0 .8rem; }

/* home page "home or business?" chooser */
.choose { border: 0; border-radius: 22px; padding: 2.2rem 2rem 1.6rem; width: min(640px, calc(100vw - 32px)); box-shadow: 0 30px 80px rgba(55, 47, 48, .35); color: var(--ink); background: #fff; text-align: center; }
.choose::backdrop { background: rgba(55, 47, 48, .6); }
.choose h2 { font-size: clamp(1.45rem, 3vw, 1.9rem); margin: .3rem 0 1.4rem; }
.choose-x { position: absolute; top: .7rem; right: .9rem; width: 2.4rem; height: 2.4rem; border: 0; border-radius: 50%; background: var(--cream); font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--ink); }
.choose-cards { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.choose-card { display: flex; flex-direction: column; align-items: center; gap: .45rem; padding: 1.5rem 1.1rem 1.2rem; border: 2px solid var(--line); border-radius: 16px;
  text-decoration: none; color: var(--ink); background: #fff; transition: border-color .15s, transform .15s, box-shadow .15s; }
.choose-card:hover, .choose-card:focus-visible { border-color: var(--orange); transform: translateY(-3px); box-shadow: var(--shadow); outline: none; }
.choose-ico { display: inline-grid; place-items: center; width: 3.4rem; height: 3.4rem; border-radius: 16px; background: var(--grad); color: #fff; }
.choose-ico svg { width: 1.8rem; height: 1.8rem; }
.choose-card strong { font-family: var(--display); font-size: 1.2rem; }
.choose-card span:not(.choose-ico) { font-size: .9rem; color: #6b5d5e; line-height: 1.45; }
.choose-card em { margin-top: auto; padding-top: .3rem; font-style: normal; font-weight: 700; color: var(--orange-deep); font-size: .92rem; }
.choose-help { margin: 1.2rem 0 0; font-size: .9rem; color: #6b5d5e; }
@media (max-width: 520px) { .choose { padding: 2rem 1.1rem 1.3rem; } .choose-cards { grid-template-columns: 1fr; } }
.hero-home .wrap > .actions { max-width: 46rem; }
/* pink button (home hero Get A Free Quote): turns into an orange outline on hover */
.btn.pink { background: #CF5A94; border-color: #CF5A94; color: #fff; }
.btn.pink:hover, .btn.pink:focus-visible { background: transparent; border-color: var(--orange-deep); color: var(--orange-deep); }
/* the italic gradient headline leans past its box; give the gradient room on both sides so letters are not clipped */
.hero-home h1 { padding: 0 .14em .08em .1em; margin-left: -.1em; }

/* customer accounts (account.js) */
.acct-wrap { max-width: 760px; margin: 0 auto; text-align: left; }
.acct-card { background: #fff; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: 1.6rem 1.7rem; margin-bottom: 1.25rem; }
.acct-card h2 { margin: 0 0 1.1rem; font-size: clamp(1.4rem, 2.6vw, 1.8rem); }
.acct-card h3 { margin: 0 0 .8rem; font-size: 1.15rem; }
.acct-grid { display: grid; grid-template-columns: 1fr 1fr; gap: .9rem 1rem; }
.acct-field { display: flex; flex-direction: column; gap: .3rem; margin-bottom: .5rem; }
.acct-field.wide { grid-column: 1 / -1; }
.acct-field label { font-weight: 700; font-size: .92rem; }
.acct-field input { font: inherit; color: var(--ink); padding: .7rem .85rem; border: 1.5px solid #D9C7C0; border-radius: 10px; background: #fff; width: 100%; }
.acct-field input:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(228, 119, 171, .3); }
.acct-actions { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; margin-top: .4rem; }
.acct-link { background: none; border: 0; padding: 0; font: inherit; font-weight: 700; color: var(--orange-deep); text-decoration: underline; cursor: pointer; }
.acct-or { display: flex; align-items: center; gap: .8rem; margin: 1.3rem 0; color: #6b5d5e; font-size: .9rem; }
.acct-or::before, .acct-or::after { content: ""; flex: 1; height: 1px; background: var(--line); }
.acct-wide { width: 100%; }
.acct-panel { margin-top: 1.2rem; padding: 1.2rem 1.3rem; border-radius: 12px; background: var(--cream); }
.acct-panel h3 { margin: 0 0 .3rem; font-size: 1.05rem; }
.acct-small { font-size: .9rem; color: #6b5d5e; }
.acct-err { color: #B3261E; font-weight: 600; background: #FDECEA; border-radius: 10px; padding: .65rem .85rem; }
.acct-ok { color: #1F6B3A; font-weight: 600; background: #E8F5EC; border-radius: 10px; padding: .65rem .85rem; }
.acct-note { text-align: center; }
.acct-head { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .5rem 1rem; margin-bottom: 1rem; }
.acct-head h2 { margin: 0; }
.acct-head p { margin: 0; display: flex; gap: .5rem; flex-wrap: wrap; }
.acct-booking { display: flex; justify-content: space-between; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--line); }
.acct-booking:last-of-type { border-bottom: 0; }
.acct-booking-side { text-align: right; white-space: nowrap; }
.acct-status { display: inline-block; padding: .15rem .6rem; border-radius: 999px; background: var(--blush); font-size: .8rem; font-weight: 700; }
.acct-pw summary { cursor: pointer; font-weight: 700; color: var(--orange-deep); margin: .4rem 0 .8rem; }
@media (max-width: 560px) { .acct-grid { grid-template-columns: 1fr; } .acct-card { padding: 1.2rem 1.1rem; } .acct-booking { flex-direction: column; } .acct-booking-side { text-align: left; } }
.acct-change { margin-top: .7rem; display: flex; flex-wrap: wrap; gap: .5rem; }
.acct-change-panel { flex-basis: 100%; margin-top: .4rem; padding: 1rem 1.1rem; border-radius: 12px; background: var(--cream); }
.acct-change-panel h4 { margin: 0 0 .4rem; font-size: 1rem; }
.acct-change-panel .acct-field { max-width: 14rem; }
.acct-times { display: flex; flex-wrap: wrap; gap: .4rem; margin: .4rem 0 .8rem; }
.acct-time { position: relative; }
.acct-time input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.acct-time span { display: inline-block; padding: .4rem .8rem; border: 1.5px solid #D9C7C0; border-radius: 999px; font-weight: 600; font-size: .9rem; background: #fff; }
.acct-time input:checked + span { background: var(--grad); color: #fff; border-color: transparent; }
.acct-booking > div:first-child { flex: 1; }
.topbar a.top-account { color: var(--pink); font-weight: 700; }
.footer-btns .btn.pink { background: transparent; border-color: var(--pink); color: var(--pink); }
.footer-btns .btn.pink:hover, .footer-btns .btn.pink:focus-visible { background: var(--pink); border-color: var(--pink); color: var(--ink); }
/* Call buttons stay the same on hover: no color change, lift or shadow */
.btn.outline[href^="tel:"]:hover, .btn.outline[href^="tel:"]:focus-visible { background: transparent; border-color: var(--orange-deep); color: var(--orange-deep); transform: none; box-shadow: none; }
/* the booking form uses the full page width, not the narrow text column, so its choices fit on one line */
.wrap.narrow:has(#irene-book), .wrap.narrow:has(.acct-dash), .wrap.narrow:has(#irene-gift) { width: min(1240px, 100% - 2.5rem); }
.section:has(.acct-dash) { padding-top: 1.5rem; }
#bk-access .bk-pill span { white-space: nowrap; }
.bk-coupon-ok { color: #1F5BD1; font-weight: 700; font-style: italic; }
.topbar a.lang-switch { display: inline-flex; align-items: center; gap: .3rem; font-weight: 600; opacity: .8; }   /* globe + word, like the Team Portal's */
.topbar a.lang-switch:hover, .topbar a.lang-switch:focus-visible { opacity: 1; text-decoration: underline; }

/* booking confirmation and receipt */
.bk-done { max-width: 620px; }
.bk-done-badge { width: 3.4rem; height: 3.4rem; margin: 0 auto .6rem; border-radius: 50%; background: var(--grad); color: #fff; display: grid; place-items: center; font-size: 1.7rem; font-weight: 800; }
.bk-confirm { margin: .2rem 0 1rem; font-size: 1.05rem; }
.bk-confirm strong { font-family: var(--display); letter-spacing: .06em; color: var(--orange-deep); }
.bk-done-when { background: var(--cream); border-radius: 12px; padding: 1rem 1.2rem; margin: 0 auto 1rem; line-height: 1.6; }
.bk-done h3 { text-align: left; margin: 1.4rem 0 .4rem; font-size: 1.05rem; }
.bk-receipt { text-align: left; }
.bk-done-actions { margin-top: 1.4rem; display: flex; justify-content: center; gap: .6rem; flex-wrap: wrap; }
@media print {
  .topbar, .site-header, .hero, .site-footer, .mobile-cta, .chat-button, .chat-panel, .bk-done-actions, .bk-wrap ~ p { display: none !important; }
  .bk-card { box-shadow: none; border: 0; }
}

/* My Booking: balance still owed after a declined card */
.acct-balance { margin-top: 1.2rem; padding: 1.1rem 1.2rem; border: 1.5px solid var(--orange, #E2582A); border-radius: 14px; background: #FFF6F1; }
.acct-balance h3 { margin: 0 0 .4rem; }
.acct-balance .bk-card-box { margin: .9rem 0; }
.acct-balance .btn { width: 100%; }

/* ---------------------------------------------------------------- My Account dashboard (account.js) */
.acct-wrap.acct-dash { max-width: 1040px; }
.ad-hero { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 1rem 1.5rem; padding: 1.8rem 2rem; border-radius: 20px;
  background: var(--grad); color: #fff; box-shadow: 0 14px 34px rgba(226, 88, 42, .25); position: relative; overflow: hidden; }
.ad-hero::after { content: ""; position: absolute; right: -60px; top: -80px; width: 260px; height: 260px; border-radius: 50%; background: rgba(255, 255, 255, .12); pointer-events: none; }
.ad-hero h2 { color: #fff; margin: 0; padding: 0; font-size: clamp(1.8rem, 4vw, 2.5rem); }
.ad-hero h2::after, .acct-dash h3::after { display: none; }
.ad-hello { margin: 0; font-weight: 700; opacity: .92; }
.ad-since { margin: .2rem 0 0; opacity: .9; font-size: .95rem; }
.ad-hero-act { display: flex; gap: .6rem; flex-wrap: wrap; position: relative; z-index: 1; }
.btn.ad-btn-light { background: #fff; border-color: #fff; color: var(--orange-deep); }
.btn.ad-btn-light:hover { background: var(--ink); border-color: var(--ink); color: #fff; }
.btn.ad-btn-ghost { background: transparent; border-color: #fff; color: #fff; }
.btn.ad-btn-ghost:hover { background: #fff; border-color: #fff; color: var(--orange-deep); }
.ad-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin: 1.1rem 0 1.4rem; }
.ad-stat { display: flex; align-items: center; gap: .85rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); padding: 1rem 1.1rem; box-shadow: var(--shadow); }
.ad-stat strong { display: block; font-family: var(--display); font-size: 1.35rem; line-height: 1.1; }
.ad-stat span:not(.ad-stat-ico) { font-size: .88rem; color: var(--ink-soft); }
.ad-stat-ico { flex: none; width: 44px; height: 44px; border-radius: 12px; background: var(--blush); color: var(--orange-deep); display: grid; place-items: center; }
.ad-stat-ico svg { width: 24px; height: 24px; }
.ad-tabs { display: flex; gap: .3rem; overflow-x: auto; border-bottom: 2px solid var(--line); margin-bottom: 1.3rem; scrollbar-width: none; }
.ad-tabs button { font: inherit; font-family: var(--display); font-weight: 700; font-size: .95rem; background: none; border: 0; padding: .75rem 1rem; color: var(--ink-soft);
  cursor: pointer; white-space: nowrap; border-bottom: 3px solid transparent; margin-bottom: -2px; position: relative; }
.ad-tabs button:hover { color: var(--orange-deep); }
.ad-tabs button[aria-selected="true"] { color: var(--orange-deep); border-bottom-color: var(--orange); }
.ad-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--pink); margin-left: .35rem; vertical-align: middle; }
.ad-panel { animation: ad-in .25s ease; }
@keyframes ad-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.ad-label { margin: 0 0 .2rem; text-transform: uppercase; letter-spacing: .08em; font-size: .78rem; font-weight: 700; color: var(--orange-deep); }
.ad-next { position: relative; background: #fff; border: 1px solid var(--line); border-left: 6px solid var(--orange); border-radius: var(--radius); padding: 1.5rem 1.6rem; box-shadow: var(--shadow); margin-bottom: 1.2rem; }
.ad-next h3 { font-size: clamp(1.3rem, 2.6vw, 1.6rem); margin: 0 0 .5rem; padding-right: 7rem; }
.ad-next.ad-empty { border-left-color: var(--pink); }
.ad-next-badge { position: absolute; top: 1.3rem; right: 1.3rem; background: var(--grad); color: #fff; font-weight: 700; font-size: .85rem; padding: .3rem .8rem; border-radius: 999px; }
.ad-setup { display: flex; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; flex-wrap: wrap; background: var(--cream); border: 1px dashed #EBC3B2;
  border-radius: var(--radius); padding: 1.3rem 1.5rem; margin-bottom: 1.2rem; }
.ad-setup > div { flex: 1 1 320px; }
.ad-setup h3 { margin: 0 0 .5rem; font-size: 1.15rem; }
.ad-setup p { margin: .5rem 0 0; }
.ad-setup-done { border-style: solid; border-color: #CFE8D7; background: #F1FAF4; justify-content: flex-start; }
.ad-setup-done > svg { width: 34px; height: 34px; color: #1F6B3A; flex: none; }
.ad-meter { height: 10px; border-radius: 999px; background: #F3DCD2; overflow: hidden; }
.ad-meter span { display: block; height: 100%; background: var(--grad); border-radius: 999px; transition: width .4s; }
.ad-meter-0 { width: 4%; } .ad-meter-1 { width: 20%; } .ad-meter-2 { width: 40%; } .ad-meter-3 { width: 60%; } .ad-meter-4 { width: 80%; } .ad-meter-5 { width: 100%; }
.ad-quicks { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
.ad-quick { display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem 1.15rem; background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  color: var(--ink); text-decoration: none; box-shadow: var(--shadow); transition: transform .15s, border-color .15s, box-shadow .15s; }
.ad-quick svg { width: 28px; height: 28px; color: var(--orange); margin-bottom: .2rem; }
.ad-quick strong { font-family: var(--display); }
.ad-quick span { font-size: .88rem; color: var(--ink-soft); line-height: 1.45; }
.ad-quick:hover { transform: translateY(-3px); border-color: var(--pink); color: var(--ink); box-shadow: 0 14px 30px rgba(228, 119, 171, .2); }
.ad-row { display: flex; gap: 1rem; align-items: flex-start; padding: 1rem 0; border-bottom: 1px solid var(--line); }
.ad-row:last-of-type { border-bottom: 0; }
.ad-date { flex: none; width: 58px; text-align: center; border-radius: 12px; background: var(--blush); padding: .4rem 0; line-height: 1.1; }
.ad-date span { display: block; font-size: .75rem; font-weight: 700; text-transform: uppercase; color: var(--orange-deep); }
.ad-date strong { font-family: var(--display); font-size: 1.4rem; }
.ad-row-main { flex: 1; min-width: 0; }
.ad-row-side { text-align: right; white-space: nowrap; }
.ad-row-side .btn { margin-top: .5rem; }
.acct-card h3 svg { width: 22px; height: 22px; vertical-align: -4px; color: var(--orange); margin-right: .15rem; }
.ad-sub { font-weight: 700; font-size: .92rem; margin: 1rem 0 .5rem; }
.ad-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .6rem; }
.ad-chip { position: relative; }
.ad-chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.ad-chip span { display: inline-block; padding: .45rem .95rem; border: 1.5px solid #D9C7C0; border-radius: 999px; font-weight: 600; font-size: .92rem; background: #fff; transition: background .15s, border-color .15s; }
.ad-chip:hover span { border-color: var(--pink); }
.ad-chip input:checked + span { background: var(--grad); color: #fff; border-color: transparent; }
.ad-chip input[type=checkbox]:checked + span::before { content: "\2713  "; }
.ad-chip input:focus-visible + span { outline: 3px solid var(--pink); outline-offset: 2px; }
.acct-field select, .acct-field textarea { font: inherit; color: var(--ink); padding: .7rem .85rem; border: 1.5px solid #D9C7C0; border-radius: 10px; background: #fff; width: 100%; }
.acct-field select:focus, .acct-field textarea:focus { outline: none; border-color: var(--orange); box-shadow: 0 0 0 3px rgba(228, 119, 171, .3); }
.acct-field input:disabled { background: var(--cream); color: var(--ink-soft); }
.ad-narrow { max-width: 16rem; margin-top: .6rem; }
.ad-toggle { display: flex; align-items: center; gap: .75rem; margin: .7rem 0; cursor: pointer; font-weight: 600; }
.ad-toggle input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.ad-toggle span { flex: none; width: 46px; height: 26px; border-radius: 999px; background: #D9C7C0; position: relative; transition: background .2s; }
.ad-toggle span::after { content: ""; position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0,0,0,.2); transition: transform .2s; }
.ad-toggle input:checked + span { background: var(--orange); }
.ad-toggle input:checked + span::after { transform: translateX(20px); }
.ad-toggle input:focus-visible + span { outline: 3px solid var(--pink); outline-offset: 2px; }
.ad-savebar { position: sticky; bottom: 0; z-index: 5; display: flex; align-items: center; justify-content: flex-end; flex-wrap: wrap; gap: .8rem 1.2rem;
  padding: .9rem 1.1rem; background: rgba(255, 255, 255, .96); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: 0 -6px 20px rgba(55, 47, 48, .08); }
.ad-savebar p { margin: 0; flex: 1 1 260px; }
.ad-addr { display: flex; gap: .9rem; align-items: center; padding: .9rem 1rem; border: 1.5px solid var(--line); border-radius: 12px; margin-bottom: .6rem; }
.ad-addr.on { border-color: var(--orange); background: var(--cream); }
.ad-addr svg { width: 24px; height: 24px; color: var(--orange); }
.ad-addr > div:nth-child(2) { flex: 1; }
.ad-addr-act { display: flex; gap: 1rem; flex-wrap: wrap; justify-content: flex-end; }
.ad-gap { margin-top: 1.6rem !important; }
@media (max-width: 860px) { .ad-quicks { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) {
  .ad-hero { padding: 1.4rem 1.3rem; }
  .ad-stats { grid-template-columns: 1fr; gap: .6rem; }
  .ad-quicks { grid-template-columns: 1fr; }
  .ad-next h3 { padding-right: 0; margin-top: 2rem; }
  .ad-row { flex-wrap: wrap; } .ad-row-side { text-align: left; width: 100%; padding-left: 74px; }
  .ad-addr { flex-wrap: wrap; } .ad-addr-act { width: 100%; justify-content: flex-start; padding-left: 2.6rem; }
}
@media (prefers-reduced-motion: reduce) { .ad-panel { animation: none; } .ad-quick, .ad-meter span { transition: none; } }
.bk-welcome { margin: 0 0 1.25rem; padding: 1rem 1.2rem; border-radius: var(--radius); background: var(--cream); border: 1px solid #F3D6C9; border-left: 5px solid var(--orange); }
.ad-ask { margin: .8rem 0 0; } .ad-ask .acct-link { display: inline-flex; align-items: center; gap: .35rem; } .ad-ask svg { width: 18px; height: 18px; }
.ad-help { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-bottom: 1.25rem; }
.ad-help-opt { font: inherit; text-align: left; display: flex; flex-direction: column; gap: .3rem; padding: 1.1rem 1.15rem; background: #fff; border: 1px solid var(--line);
  border-radius: var(--radius); color: var(--ink); text-decoration: none; box-shadow: var(--shadow); cursor: pointer; transition: transform .15s, border-color .15s; }
.ad-help-opt svg { width: 28px; height: 28px; color: var(--orange); }
.ad-help-opt strong { font-family: var(--display); }
.ad-help-opt span { font-size: .88rem; color: var(--ink-soft); }
.ad-help-opt:hover { transform: translateY(-3px); border-color: var(--pink); color: var(--ink); }
.ad-card-head { display: flex; justify-content: space-between; align-items: center; gap: .8rem; flex-wrap: wrap; margin-bottom: .6rem; }
.ad-card-head h3 { margin: 0; }
.ad-ticket { font: inherit; color: inherit; width: 100%; text-align: left; display: flex; justify-content: space-between; align-items: center; gap: 1rem; background: none; border: 0;
  border-bottom: 1px solid var(--line); padding: .9rem .3rem; cursor: pointer; }
.ad-ticket:hover { background: var(--cream); }
.ad-ticket.unread strong { color: var(--orange-deep); }
.ad-new { display: inline-block; background: var(--grad); color: #fff; border-radius: 999px; padding: .05rem .55rem; font-size: .75rem; font-weight: 700; }
.acct-status.ad-t-closed { background: #E8F5EC; color: #1F6B3A; } .acct-status.ad-t-waiting { background: #FFF1D6; color: #7A4B00; }
.ad-thread { display: flex; flex-direction: column; gap: .6rem; margin: 1rem 0; }
.ad-tmsg { max-width: 85%; padding: .75rem 1rem; border-radius: 14px; }
.ad-tmsg p { margin: 0 0 .3rem; white-space: pre-wrap; }
.ad-tmsg span { font-size: .8rem; opacity: .8; }
.ad-tmsg.me { align-self: flex-end; background: var(--orange-deep); color: #fff; border-bottom-right-radius: 4px; }
.ad-tmsg.them { align-self: flex-start; background: var(--cream); border: 1px solid var(--line); border-bottom-left-radius: 4px; }
.ad-sys { text-align: center; font-size: .82rem; color: var(--ink-soft); margin: 0; }
.acct-card h3 svg { flex: none; }
@media (max-width: 760px) { .ad-help { grid-template-columns: 1fr; } }
.ad-stats.four { grid-template-columns: repeat(4, 1fr); }
.ad-stat-link { text-decoration: none; color: inherit; display: block; }
.ad-stat-link .ad-stat { height: 100%; transition: transform .15s, border-color .15s; }
.ad-stat-link:hover .ad-stat { transform: translateY(-2px); border-color: var(--pink); }
.ad-big { font-family: var(--display); font-weight: 700; font-size: 1.5rem; color: var(--orange-deep); }
.ad-points .ad-meter { margin: .4rem 0 .8rem; height: 14px; }
.ad-earn { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; margin: 1.1rem 0 .6rem; }
.ad-earn > div { display: grid; grid-template-columns: 30px 1fr; column-gap: .6rem; align-items: start; background: var(--cream); border-radius: 12px; padding: .8rem .9rem; }
.ad-earn svg { width: 26px; height: 26px; color: var(--orange); grid-row: span 2; }
.ad-earn span { font-size: .88rem; color: var(--ink-soft); }
.ad-share { display: flex; gap: .5rem; flex-wrap: wrap; }
.ad-share input { flex: 1 1 240px; font: inherit; padding: .6rem .8rem; border: 1.5px solid #D9C7C0; border-radius: 10px; background: var(--cream); color: var(--ink); min-width: 0; }
.ad-ledger { list-style: none; padding: 0; margin: .6rem 0 0; }
.ad-ledger li { display: grid; grid-template-columns: 7.5rem 1fr auto; gap: .8rem; padding: .55rem 0; border-bottom: 1px solid var(--line); font-size: .93rem; }
.ad-ledger li span:first-child { color: var(--ink-soft); }
.ad-ledger .plus { color: #1F6B3A; } .ad-ledger .minus { color: var(--ink-soft); }
.ad-w-0 { width: 3%; } .ad-w-5 { width: 5%; } .ad-w-10 { width: 10%; } .ad-w-15 { width: 15%; } .ad-w-20 { width: 20%; } .ad-w-25 { width: 25%; } .ad-w-30 { width: 30%; } .ad-w-35 { width: 35%; } .ad-w-40 { width: 40%; } .ad-w-45 { width: 45%; } .ad-w-50 { width: 50%; } .ad-w-55 { width: 55%; } .ad-w-60 { width: 60%; } .ad-w-65 { width: 65%; } .ad-w-70 { width: 70%; } .ad-w-75 { width: 75%; } .ad-w-80 { width: 80%; } .ad-w-85 { width: 85%; } .ad-w-90 { width: 90%; } .ad-w-95 { width: 95%; } .ad-w-100 { width: 100%; } 
@media (max-width: 860px) { .ad-stats.four { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .ad-stats.four { grid-template-columns: 1fr; } .ad-earn { grid-template-columns: 1fr; } .ad-ledger li { grid-template-columns: 1fr auto; } .ad-ledger li span:first-child { grid-column: 1 / -1; } }
.ad-gap-sm { margin: 1rem 0 0; } .ad-gap-sm .btn svg { width: 18px; height: 18px; vertical-align: -3px; }
/* e-gift cards (gift.js) */
.acct-wrap.gf-wrap { max-width: 1040px; }
.gf { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 1.5rem; align-items: start; }
.gf h2 { font-size: 1.15rem; margin: 1.4rem 0 .7rem; } .gf h2:first-child { margin-top: 0; }
.gf h2::after { display: none; }
.gf-narrow { max-width: 14rem; }
.gf-designs { display: flex; gap: .7rem; flex-wrap: wrap; }
.gf-design { position: relative; cursor: pointer; }
.gf-design input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.gf-swatch { display: grid; place-items: center; width: 150px; height: 88px; border-radius: 14px; color: #fff; font-family: Georgia, serif; font-style: italic; text-align: center;
  padding: .5rem; font-size: .95rem; box-shadow: var(--shadow); outline: 3px solid transparent; outline-offset: 3px; transition: outline-color .15s, transform .15s; }
.gf-design input:checked + .gf-swatch { outline-color: var(--orange); }
.gf-design input:focus-visible + .gf-swatch { outline-color: var(--pink); }
.gf-design:hover .gf-swatch { transform: translateY(-2px); }
.gf-side { position: sticky; top: 110px; }
.gf-card { aspect-ratio: 1.6; border-radius: 20px; color: #fff; padding: 1.4rem 1.5rem; display: flex; flex-direction: column; box-shadow: 0 18px 40px rgba(191, 69, 25, .28); position: relative; overflow: hidden; }
.gf-card::after { content: ""; position: absolute; right: -50px; top: -60px; width: 190px; height: 190px; border-radius: 50%; background: rgba(255, 255, 255, .14); }
.gf-card-brand { font-family: var(--display); font-weight: 800; letter-spacing: .12em; font-size: .9rem; opacity: .95; }
.gf-card-title { font-family: Georgia, serif; font-style: italic; font-size: 1.6rem; margin-top: auto; }
.gf-card-amt { font-family: var(--display); font-weight: 800; font-size: 2.2rem; line-height: 1.1; }
.gf-card-to { font-size: .85rem; margin-top: .4rem; opacity: .95; }
.gf-card-msg { font-size: .85rem; font-style: italic; opacity: .95; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.gf-side-note { text-align: center; margin-top: .8rem; }
.gf-pay { width: 100%; }
.gf-done { text-align: center; }
@media (max-width: 860px) { .gf { grid-template-columns: 1fr; } .gf-side { position: static; order: -1; max-width: 380px; margin: 0 auto; width: 100%; } }
.ad-rate { display: flex; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; flex-wrap: wrap; background: #fff; border: 1px solid var(--line); border-radius: var(--radius);
  padding: 1.2rem 1.5rem; margin-bottom: 1.2rem; box-shadow: var(--shadow); }
.ad-rate h3 { margin: 0 0 .3rem; font-size: 1.15rem; } .ad-rate p { margin: 0; }
.ad-stars { display: flex; gap: .2rem; }
.ad-stars button { font-size: 2.1rem; line-height: 1; background: none; border: 0; color: #E8D3CB; cursor: pointer; padding: .1rem; transition: color .1s, transform .1s; }
.ad-stars:hover button { color: var(--orange); }
.ad-stars button:hover ~ button { color: #E8D3CB; }
.ad-stars button:hover { transform: scale(1.15); }
.ad-stars button:focus-visible { outline: 3px solid var(--pink); border-radius: 6px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
/* My Account: no page hero, wider dashboard, tabs wrap instead of hiding off the edge (Torrey, 10/31) */
.acct-wrap.acct-dash { max-width: 1280px; }
.acct-dash .ad-tabs { flex-wrap: wrap; overflow: visible; row-gap: .2rem; }
.acct-dash .ad-tabs button { padding: .7rem .85rem; }
@media (max-width: 600px) { .acct-dash .ad-tabs { display: grid; grid-template-columns: repeat(2, 1fr); border-bottom: 0; gap: .4rem; }
  .acct-dash .ad-tabs button { border: 1.5px solid var(--line); border-radius: 10px; margin: 0; text-align: center; }
  .acct-dash .ad-tabs button[aria-selected="true"] { border-color: var(--orange); background: var(--cream); } }
@media (max-width: 600px) {
  .ad-stats, .ad-stats.four { grid-template-columns: 1fr 1fr; gap: .6rem; }
  .ad-stat { flex-direction: column; align-items: flex-start; gap: .4rem; padding: .8rem .9rem; }
  .ad-stat-ico { width: 34px; height: 34px; } .ad-stat strong { font-size: 1.15rem; }
  .ad-hero-act .btn { flex: 1 1 auto; text-align: center; }
}
/* My Account: first-login welcome pop-up */
.ad-modal-back { position: fixed; inset: 0; z-index: 1000; background: rgba(40, 30, 32, .62); display: grid; place-items: center; padding: 1rem; animation: ad-fade .2s ease; }
.ad-modal { position: relative; width: min(760px, 100%); max-height: calc(100vh - 2rem); overflow-y: auto; background: #fff; border-radius: 20px; padding: 1.8rem 1.8rem 1.5rem;
  box-shadow: 0 30px 80px rgba(0, 0, 0, .35); border-top: 6px solid var(--orange); animation: ad-pop .25s ease; }
.ad-modal h2 { font-size: clamp(1.35rem, 3.4vw, 1.9rem); margin: 0 2rem .9rem 0; }
.ad-modal h2::after { display: none; }
.ad-modal-x { position: absolute; top: .7rem; right: .8rem; width: 40px; height: 40px; border-radius: 50%; border: 0; background: var(--cream); font-size: 1.6rem; line-height: 1; cursor: pointer; color: var(--ink); }
.ad-modal-x:hover { background: var(--blush); }
.ad-video { position: relative; aspect-ratio: 16 / 9; border-radius: 14px; overflow: hidden; background: #1d1718; margin-bottom: 1.1rem; }
.ad-video iframe, .ad-video video { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.ad-wl-list { list-style: none; padding: 0; margin: .4rem 0 1.2rem; display: grid; gap: .7rem; }
.ad-wl-list li { display: flex; gap: .8rem; align-items: flex-start; background: var(--cream); border-radius: 12px; padding: .75rem .9rem; }
.ad-wl-list svg { width: 26px; height: 26px; flex: none; color: var(--orange); }
.ad-modal-act { display: flex; align-items: center; gap: 1.2rem; flex-wrap: wrap; }
body.ad-noscroll { overflow: hidden; }
@keyframes ad-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ad-pop { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
@media (max-width: 600px) { .ad-modal { padding: 1.4rem 1.1rem 1.2rem; } .ad-modal-act .btn { width: 100%; text-align: center; } }
@media (prefers-reduced-motion: reduce) { .ad-modal-back, .ad-modal { animation: none; } }
.bk-suggest { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; list-style: none; margin: .25rem 0 0; padding: .3rem; background: #fff; border: 1px solid var(--line);
  border-radius: 12px; box-shadow: 0 14px 30px rgba(55, 47, 48, .15); }
.bk-suggest li { padding: .6rem .75rem; border-radius: 8px; cursor: pointer; font-size: .95rem; }
.bk-suggest li:hover, .bk-suggest li[aria-selected="true"] { background: var(--cream); }
.bk-suggest::after { content: "powered by Google"; display: block; text-align: right; font-size: .7rem; color: var(--ink-soft); padding: .2rem .5rem 0; }