:root {
  --ink: #0e3145;
  --soft-ink: #4f6674;
  --teal: #078b86;
  --teal-dark: #056d69;
  --coral: #f06449;
  --gold: #f7b84b;
  --cream: #fff4e6;
  --paper: #fffaf2;
  --mint: #d9f4ee;
  --blue: #e7f3fb;
  --line: rgba(14, 49, 69, 0.16);
  --shadow: 0 22px 60px rgba(14, 49, 69, 0.14);
}

/* App family: make the product lineup read as a designed showcase. */
.apps-section{background:linear-gradient(180deg,#fffaf4 0%,#f3f8f6 100%)}
.apps-section>.section-heading{max-width:760px;margin-inline:auto;margin-bottom:2.4rem}
.apps-section>.section-heading h2{max-width:650px;margin-inline:auto}
.apps-section>.section-heading>p:last-child{max-width:600px;margin-inline:auto}
.app-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.35rem;align-items:stretch}
.app-card{border:1px solid rgba(18,48,78,.1);border-radius:28px;background:#fff;box-shadow:0 18px 42px rgba(18,48,78,.1);padding:0;}
.app-card-feature{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,.75fr);min-height:430px}
.app-card-feature figure{height:100%;min-height:430px;aspect-ratio:auto;background:#f4eadc;border-radius:28px 0 0 28px}
.app-card-feature figure img{padding:0;object-fit:cover}
.app-copy{padding:1.6rem 1.7rem 1.7rem;gap:.7rem}
.app-copy h3{font-size:clamp(1.55rem,2.6vw,2.25rem);margin:0}
.app-copy>p:not(.status):not(.app-kicker){color:#536b77;line-height:1.6}
.app-kicker{margin:0;color:#13827e;font-size:.78rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.app-card:not(.app-card-feature){display:flex;flex-direction:column}
.app-card:nth-child(2)::before,.app-card:nth-child(3)::before,.app-card:nth-child(4)::before{content:"";display:block;height:220px;background-position:center;background-size:cover;background-repeat:no-repeat;border-radius:28px 28px 0 0}
.app-card:nth-child(2)::before{background-image:url('/app-covers/paper-trail.jpg')}
.app-card:nth-child(3)::before{background-image:url('/app-covers/i-lift.png')}
.app-card:nth-child(4)::before{background-image:url('/app-covers/tech-help.png')}
.app-card:nth-child(4){grid-column:1/-1;background:#fffdf9}
.app-card:not(.app-card-feature) .app-copy{flex:1}
.app-card:not(.app-card-feature) figure{height:230px;aspect-ratio:auto;border-radius:28px 28px 0 0;background:#f3eee7}
.app-card:not(.app-card-feature) figure img{padding:0;object-fit:cover}
.screenshot-strip{grid-template-columns:repeat(3,1fr);gap:.55rem;margin:.8rem 0 .25rem}
.screenshot-strip img,.screenshot-strip img:first-child{grid-column:auto;height:155px;object-fit:contain;border-radius:12px;box-shadow:none}
.app-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:.25rem}
.store-links{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:auto;padding-top:.6rem}
.store-links a{display:inline-flex;align-items:center;justify-content:center;border:1px solid #d7e5df;border-radius:999px;padding:.55rem .8rem;color:#12304e;font-weight:750;font-size:.82rem;text-decoration:none;background:#f7fbf9}
.store-links a:hover{background:#e7f4ef}
.app-card-feature .store-links a{background:#fff8ef}
.app-card-feature .store-links a:hover{background:#ffedd7}
.apps-intro{max-width:700px;margin-inline:auto;margin-bottom:2.5rem}
.modern-app-grid{display:grid;gap:1.25rem;width:100%;max-width:1100px;margin:auto}
.modern-app{overflow:hidden;border:1px solid rgba(18,48,78,.13);border-radius:30px;background:#fff;box-shadow:0 18px 45px rgba(18,48,78,.1);transition:transform .2s ease,box-shadow .2s ease}
.modern-app:hover{transform:translateY(-3px);box-shadow:0 24px 58px rgba(18,48,78,.15)}
.modern-app summary{display:grid;grid-template-columns:minmax(0,38%) minmax(0,1fr);min-width:0;min-height:245px;cursor:pointer;list-style:none}
.modern-app summary>*{min-width:0}
.modern-app summary::-webkit-details-marker{display:none}
.modern-app summary img{width:100%;height:100%;min-height:245px;padding:0;object-fit:cover;object-position:center;display:block;background:#f4eadc}
.modern-app:not(.modern-app-feature):not(.modern-app-badass) summary img{padding:12px;object-fit:contain}
.modern-app-tease{display:flex;flex-direction:column;justify-content:center;gap:.65rem;padding:2rem 2.2rem;background:linear-gradient(135deg,#fff,#f4faf7)}
.modern-app-tease b{font-family:Georgia,serif;font-size:clamp(1.7rem,3vw,2.7rem);color:#12304e}
.modern-app-tease small{font-size:1.05rem;color:#56707a}
.modern-app-tease i{margin-top:1rem;color:#13827e;font-style:normal;font-weight:850}
.modern-app-feature{border:2px solid #168c86;box-shadow:0 22px 60px rgba(19,130,126,.18)}
.modern-app-feature .modern-app-tease{background:linear-gradient(135deg,#eaf8f3,#fff7eb)}
.modern-app-soon{background:#fffaf1}
.freebie-section{background:linear-gradient(135deg,#eef8f5,#fff8ed)}.freebie-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem;max-width:1100px;margin:auto}.freebie-card{display:grid;grid-template-columns:auto 1fr;gap:1rem;align-items:start;padding:1.5rem;border:1px solid #c7e2da;border-radius:24px;background:#fff;color:#12304e;text-decoration:none;box-shadow:0 12px 28px rgba(18,48,78,.08);transition:transform .2s ease,box-shadow .2s ease}.freebie-card:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(18,48,78,.13)}.freebie-card h3{margin:0 0 .5rem;font-family:Georgia,serif;font-size:1.55rem}.freebie-card p{margin:0 0 1rem;color:#58717b;line-height:1.55}.freebie-card strong{color:#13827e}.freebie-icon{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#f0644f;color:#fff;font-weight:900}
.modern-app-badass{background:linear-gradient(135deg,#14283f,#243d5a);color:#fff;border-color:#f0b84b}.modern-app-badass .modern-app-tease{background:linear-gradient(135deg,#182d47,#294565)}.modern-app-badass .modern-app-tease b,.modern-app-badass .modern-app-tease small{color:#fff}.modern-app-badass .modern-app-tease i{color:#fff;background:#b83b46;border-color:#e46b55}
.modern-app-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,.85fr);gap:2rem;padding:2rem 2.2rem 2.25rem;border-top:1px solid #e9e2d9;background:#fff}
.modern-app:not(.modern-app-badass) .modern-app-body{grid-template-columns:1fr}
.modern-app:not(.modern-app-badass) .modern-screens{display:none}
.modern-app-body{display:none}
.modern-app[open] .modern-app-body{display:grid}
.modern-app-body h3{margin:.3rem 0 .7rem;font-size:clamp(1.5rem,2.4vw,2.2rem)}
.modern-app-body p:not(.eyebrow){color:#58717b;line-height:1.65}
.modern-app-body ul{padding-left:1.2rem;color:#12304e;line-height:1.8}
.modern-actions{display:flex;align-items:center;gap:.55rem;flex-wrap:wrap;margin-top:1.3rem}
.modern-actions a:not(.button){display:inline-flex;align-items:center;gap:.5rem;min-height:46px;padding:.62rem 1rem;border:1px solid #cfe2dc;border-radius:15px;color:#12304e;font-weight:850;text-decoration:none;background:#f7fbf9;box-shadow:0 5px 12px rgba(18,48,78,.06)}
.modern-actions a:not(.button)::before{display:grid;place-items:center;width:27px;height:27px;border-radius:50%;background:#dcefe9;color:#13827e;font-size:.82rem;font-weight:950}
.modern-actions a[href*="apps.apple"]::before{content:"";font-size:1.05rem}
.modern-actions a[href*="play.google"]::before{content:"▶";font-size:.72rem}
.modern-actions a:not(.button):hover{background:#e5f4ee;transform:translateY(-1px)}
.modern-actions .button{min-height:46px;padding-inline:1.15rem;box-shadow:0 7px 15px rgba(18,48,78,.13)}
.app-price{margin:.95rem 0 0;color:var(--teal-dark)!important;font-size:.92rem;font-weight:900;line-height:1.45!important}
.app-privacy-note{margin:.7rem 0 0;color:var(--soft-ink)!important;font-size:.9rem;line-height:1.45!important}
.pricing-anchor{margin-top:1rem;color:var(--teal-dark)!important;font-size:.92rem;font-weight:850}
.recommended-package{border-color:var(--teal)!important;box-shadow:0 16px 36px rgba(7,139,134,.14)!important}
.modern-screens{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem;align-items:center}
.modern-screens img{width:100%;height:250px;max-height:250px;min-height:0;padding:10px;object-fit:contain;object-position:center;border-radius:16px;background:#f6f2ec;border:1px solid #e7dfd5}
.modern-app-badass .modern-app-body{grid-template-columns:1fr;gap:1.5rem}
.modern-app-badass .modern-screens{grid-template-columns:repeat(2,minmax(0,1fr));max-width:980px}
.games-section{background:linear-gradient(180deg,#fff7e7,#fff)}.games-section .section-heading p:not(.eyebrow){max-width:58ch;margin-inline:auto}.games-section .modern-app-grid{max-width:1100px}
.faq-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;max-width:900px;margin:auto}.faq-grid details{padding:1rem 1.15rem;border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 10px 24px rgba(18,48,78,.06)}.faq-grid summary{cursor:pointer;color:var(--ink);font-weight:900}.faq-grid p{margin:.8rem 0 0;color:var(--soft-ink);line-height:1.6}
.app-popup[aria-hidden="true"]{display:none}
.app-popup{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:1.2rem}
.app-popup-backdrop{position:absolute;inset:0;background:rgba(9,29,45,.68);backdrop-filter:blur(7px)}
.app-popup-card{position:relative;width:min(980px,100%);max-height:90vh;overflow:auto;border-radius:30px;background:#fff;box-shadow:0 28px 90px rgba(0,0,0,.3)}
.app-popup-content{padding:2.4rem}.app-popup-content>div{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.9fr);gap:2rem}.app-popup-content h3{font-size:clamp(1.8rem,3vw,2.7rem);margin:.25rem 0 .7rem}.app-popup-content p:not(.eyebrow){color:#58717b;line-height:1.7}.app-popup-content ul{padding-left:1.2rem;line-height:1.9}.app-popup-content .modern-screens{display:grid}.app-popup-close{position:absolute;z-index:2;top:.8rem;right:.8rem;width:42px;height:42px;border:0;border-radius:50%;background:#f5efe7;color:#12304e;font-size:1.7rem;cursor:pointer}.app-popup-open{overflow:hidden}
@media(max-width:700px){.modern-app summary{grid-template-columns:1fr}.modern-app summary img{width:100%;height:auto;aspect-ratio:1 / 1;min-height:0;padding:0;object-fit:cover;object-position:center;background:#f4eadc}.modern-app:not(.modern-app-feature):not(.modern-app-badass) summary img{width:calc(100% - 2rem);max-width:360px;height:auto;min-height:0;aspect-ratio:1 / 1;margin:.75rem auto 0;padding:0;object-fit:contain;border-radius:24px}.modern-app-body{grid-template-columns:1fr;padding:1.4rem}.modern-screens{grid-template-columns:1fr;gap:.85rem}.modern-screens img{height:auto;max-height:420px;padding:12px}.modern-app-tease{padding:1.35rem 1.4rem}.modern-app-tease i{margin-top:.35rem}.freebie-grid{grid-template-columns:1fr;gap:1rem}.freebie-card{grid-template-columns:auto 1fr;padding:1.2rem;gap:.8rem}.freebie-card h3{font-size:1.35rem}.freebie-card p{font-size:.96rem}}
@media(max-width:700px){.app-popup-content{padding:1.7rem 1.2rem}.app-popup-content>div{grid-template-columns:1fr}.app-popup-card{max-height:94vh;border-radius:24px}.app-popup-content .modern-screens{grid-template-columns:1fr}.app-popup-content .modern-screens img{height:auto;max-height:420px}}
@media(min-width:701px){.app-popup-content .modern-screens{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:700px){.app-gallery{grid-template-columns:1fr}.app-card-feature{grid-column:auto;grid-template-columns:1fr}.app-card-feature figure{min-height:260px;height:260px;border-radius:28px 28px 0 0}.app-card:not(.app-card-feature) figure{height:240px}.screenshot-strip img,.screenshot-strip img:first-child{height:180px}}

.screenshot-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin:1.25rem 0 1rem;align-items:start}
.screenshot-strip img{display:block;width:100%;height:220px;object-fit:contain;object-position:top;border:1px solid #e6ded2;border-radius:14px;background:#f7f4ef;box-shadow:0 8px 18px rgba(18,48,78,.08)}
.screenshot-strip img:first-child{grid-column:1/-1;height:520px}
@media (max-width:700px){.screenshot-strip img{height:190px}.screenshot-strip img:first-child{height:520px}}

* {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--ink);
  background:
    radial-gradient(circle at 10% 10%, rgba(247, 184, 75, 0.22), transparent 21rem),
    radial-gradient(circle at 90% 12%, rgba(7, 139, 134, 0.18), transparent 24rem),
    linear-gradient(180deg, #fff7ed 0%, #ffffff 46%, var(--paper) 100%);
}

body.modal-open {
  overflow: hidden;
}

a {
  color: inherit;
}

img {
  display: block;
  max-width: 100%;
}

.site-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem clamp(1rem, 4vw, 4rem);
  background: rgba(255, 250, 242, 0.92);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(16px);
}

.brand {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  font-weight: 950;
  text-decoration: none;
  white-space: nowrap;
}

.brand-mark {
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 999px;
  color: white;
  background: var(--coral);
  box-shadow: 0 10px 26px rgba(240, 100, 73, 0.3);
}

nav {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.3rem;
}

nav a {
  padding: 0.55rem 0.72rem;
  border-radius: 999px;
  color: var(--soft-ink);
  text-decoration: none;
  font-size: 0.92rem;
  font-weight: 850;
}

nav a:hover,
.button:hover,
.text-button:hover,
.door-card:hover {
  transform: translateY(-2px);
}

.hero,
.section,
footer {
  width: min(1180px, calc(100% - 2rem));
  margin-inline: auto;
}

.hero {
  display: grid;
  grid-template-columns: minmax(340px, 1.08fr) minmax(0, 0.92fr);
  gap: clamp(1.25rem, 4vw, 2rem);
  align-items: center;
  padding: clamp(2.2rem, 6vw, 5rem) 0 clamp(1.4rem, 4vw, 3rem);
}

.hero-art {
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 8px;
  background: white;
  box-shadow: var(--shadow);
}

.hero-art img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  padding: 0.75rem;
  background: #fff8ef;
}

.hero-copy {
  max-width: 900px;
}

.hero-copy h1,
.section-heading h2,
.shop-section h2,
.custom-section h2,
.about h2 {
  margin: 0;
  letter-spacing: 0;
  line-height: 0.96;
}

.hero-copy h1 {
  max-width: 15ch;
  font-size: clamp(2.75rem, 4.1vw, 4.6rem);
}

.hero-copy p,
.section-heading p,
.door-card p,
.app-copy p,
.shop-section p,
.custom-section p,
.about p,
.modal-card p,
.service-grid li {
  color: var(--soft-ink);
  line-height: 1.58;
}

.hero-copy > p:not(.eyebrow):not(.micro) {
  max-width: 58rem;
  font-size: 1.17rem;
}

.proof-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:.8rem;width:min(1100px,calc(100% - 2rem));margin:0 auto;padding:0 0 1.6rem}.proof-strip span{display:inline-flex;align-items:center;gap:.45rem;padding:.7rem 1rem;border:1px solid var(--line);border-radius:999px;background:rgba(255,255,255,.78);color:var(--soft-ink);font-weight:800}.proof-strip strong{color:var(--teal-dark);font-size:1.15rem}

.eyebrow {
  margin: 0 0 0.75rem;
  color: var(--teal-dark);
  text-transform: uppercase;
  font-size: 0.78rem;
  font-weight: 950;
  letter-spacing: 0.12em;
}

.micro,
.fine-print {
  color: var(--soft-ink);
  font-size: 0.92rem;
}

.actions,
.mini-actions,
.footer-links,
.modal-actions,
.center-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.72rem;
  align-items: center;
}

.actions {
  margin-top: 1.35rem;
}

.center-actions {
  justify-content: center;
  margin-top: 1.4rem;
}

.button,
.text-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.9rem;
  padding: 0.84rem 1.05rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--ink);
  background: white;
  text-decoration: none;
  font: inherit;
  font-weight: 950;
  cursor: pointer;
  transition: transform 0.16s ease, background 0.16s ease, border-color 0.16s ease;
}

.button.primary {
  color: white;
  border-color: var(--teal);
  background: var(--teal);
  box-shadow: 0 14px 30px rgba(7, 139, 134, 0.22);
}

.button.primary:hover {
  background: var(--teal-dark);
}

.text-button {
  min-height: 2.55rem;
  padding: 0.68rem 0.9rem;
  color: white;
  border-color: var(--coral);
  background: var(--coral);
}

.section {
  padding: clamp(3rem, 7vw, 5.5rem) 0;
}

.section-heading {
  margin-bottom: 1.5rem;
}

.section-heading.centered {
  max-width: 760px;
  margin-inline: auto;
  text-align: center;
}

.section-heading h2,
.shop-section h2,
.custom-section h2,
.about h2 {
  max-width: 14ch;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(2.15rem, 3.8vw, 3.9rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  line-height: 1.04;
}

.centered h2 {
  margin-inline: auto;
  max-width: 16ch;
}

.section-heading p {
  max-width: 66ch;
  font-size: 1.05rem;
}

.split-heading {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(300px, 0.8fr);
  gap: 1.4rem;
  align-items: end;
}

.door-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}

.door-card,
.app-card,
.service-grid article,
.shop-section,
.custom-section,
.about-card,
.modal-card {
  border: 1px solid var(--line);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  box-shadow: var(--shadow);
}

.door-card {
  position: relative;
  overflow: hidden;
  min-height: 16rem;
  padding: 1.2rem;
  text-decoration: none;
  transition: transform 0.16s ease;
}

.door-card::before {
  content: "";
  position: absolute;
  right: -3.5rem;
  top: -3.5rem;
  width: 9rem;
  height: 9rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.58);
}

.door-card::after {
  content: none;
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  padding: 0.45rem 0.7rem;
  border-radius: 999px;
  color: var(--ink);
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(14, 49, 69, 0.12);
  font-size: 0.78rem;
  font-weight: 950;
}

.service-door::after {
  content: "Hire help";
}

.shop-door::after {
  content: "Shop tools";
}

.custom-door::after {
  content: "Build it";
}

.door-card span {
  display: inline-flex;
  position: relative;
  z-index: 1;
  margin-bottom: 1.25rem;
  padding: 0.45rem 0.68rem;
  border-radius: 999px;
  color: white;
  background: var(--coral);
  font-weight: 950;
  box-shadow: 0 10px 24px rgba(240, 100, 73, 0.18);
}

.door-card h3 {
  position: relative;
  z-index: 1;
  margin: 0;
  font-size: clamp(1.45rem, 2.5vw, 2rem);
  line-height: 1;
}

.door-card p {
  position: relative;
  z-index: 1;
  padding-right: 1.2rem;
}

.app-door {
  background: linear-gradient(180deg, var(--mint), white);
}

.service-door {
  background: linear-gradient(180deg, #fff0d0, white);
}

.shop-door {
  background: linear-gradient(180deg, #ffe5dd, white);
}

.custom-door {
  background: linear-gradient(180deg, var(--blue), white);
}

.apps-section {
  width: 100%;
  max-width: none;
  padding-inline: max(1rem, calc((100% - 1180px) / 2));
  background: linear-gradient(180deg, rgba(217, 244, 238, 0.55), rgba(255, 250, 242, 0.88));
  border-block: 1px solid var(--line);
}

.app-gallery {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.app-card {
  overflow: hidden;
  display: grid;
  grid-template-rows: auto 1fr;
  min-height: 100%;
}

.app-card-feature {
  grid-column: auto;
  grid-template-columns: none;
  grid-template-rows: auto 1fr;
}

.app-card figure {
  display: grid;
  place-items: center;
  margin: 0;
  background: #fff8ef;
  aspect-ratio: 1 / 1;
  height: auto;
}

.app-card img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  padding: 0.7rem;
  object-position: center;
}

.app-copy {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.55rem;
  padding: 1.1rem;
}

.app-copy .text-button {
  margin-top: auto;
}

.app-copy h3,
.service-grid h3 {
  margin: 0;
  font-size: 1.45rem;
}

.status {
  display: inline-flex;
  width: fit-content;
  margin: 0;
  padding: 0.32rem 0.62rem;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 950;
}

.status.available {
  color: #075b4f;
  background: var(--mint);
}

.status.soon {
  color: #80422c;
  background: #ffe0d6;
}

.freelance {
  width: min(1220px, calc(100% - 2rem));
}

.service-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}

.service-grid article {
  position: relative;
  overflow: hidden;
  padding: 1.2rem;
}

.service-grid article::after {
  content: "";
  position: absolute;
  right: -2.8rem;
  bottom: -3.4rem;
  width: 9rem;
  height: 9rem;
  border-radius: 999px;
  background: rgba(7, 139, 134, 0.08);
}

.service-badge {
  display: inline-flex;
  width: fit-content;
  margin-bottom: 0.85rem;
  padding: 0.4rem 0.68rem;
  border-radius: 999px;
  color: var(--teal-dark);
  background: var(--mint);
  border: 1px solid rgba(7, 139, 134, 0.18);
  font-size: 0.78rem;
  font-weight: 950;
}

.service-grid ul,
.modal-card ul {
  display: grid;
  gap: 0.55rem;
  margin: 0.9rem 0 0;
  padding-left: 1.15rem;
}

.feature-service {
  background: linear-gradient(180deg, var(--mint), white) !important;
}

.shop-section,
.custom-section {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(280px, 0.7fr);
  gap: 1.4rem;
  align-items: center;
  padding: clamp(1.3rem, 4vw, 2rem);
}

.shop-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
}

.shop-badges span {
  display: inline-flex;
  padding: 0.72rem 0.9rem;
  border-radius: 999px;
  color: var(--ink);
  background: var(--paper);
  border: 1px solid var(--line);
  font-weight: 900;
}

.custom-section {
  background:
    radial-gradient(circle at bottom right, rgba(240, 100, 73, 0.18), transparent 18rem),
    white;
}

.contact-note {
  max-width: 58ch;
  margin-top: 1rem;
  color: var(--ink) !important;
  font-weight: 850;
}

.about-card {
  padding: clamp(1.25rem, 4vw, 2rem);
  background:
    radial-gradient(circle at bottom right, rgba(7, 139, 134, 0.14), transparent 18rem),
    white;
}

.about-card h2 {
  max-width: 18ch;
}

.tagline {
  color: var(--ink) !important;
  font-weight: 950;
}

.modal[aria-hidden="true"] {
  display: none;
}

.modal {
  position: fixed;
  inset: 0;
  z-index: 50;
  display: grid;
  place-items: center;
  padding: 1rem;
}

.modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(14, 49, 69, 0.42);
}

.modal-card {
  position: relative;
  z-index: 1;
  width: min(660px, 100%);
  max-height: min(86vh, 720px);
  overflow: auto;
  padding: clamp(1.2rem, 4vw, 2rem);
  background: white;
}

.modal-card h2 {
  margin: 0.65rem 0 0.4rem;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 0.98;
}

.modal-card h3 {
  margin: 1.2rem 0 0;
}

.modal-close {
  position: absolute;
  top: 0.7rem;
  right: 0.7rem;
  display: grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--paper);
  color: var(--ink);
  font-size: 1.1rem;
  font-weight: 950;
  cursor: pointer;
}

.modal-actions {
  margin-top: 1.2rem;
}

.store-button {
  display: inline-grid;
  gap: 0.12rem;
  align-content: center;
  min-width: 9.5rem;
  min-height: 3.3rem;
  padding: 0.7rem 1rem;
  border-radius: 999px;
  color: white;
  background: var(--teal);
  text-decoration: none;
  font-weight: 950;
  line-height: 1.05;
  box-shadow: 0 12px 26px rgba(7, 139, 134, 0.18);
}

.store-button small {
  color: rgba(255, 255, 255, 0.82);
  font-size: 0.72rem;
  font-weight: 850;
}

.store-button.disabled {
  color: var(--soft-ink);
  background: var(--paper);
  border: 1px solid var(--line);
  box-shadow: none;
}

.store-button.disabled small {
  color: var(--coral);
}

footer {
  padding: 2rem 0 3rem;
  border-top: 1px solid var(--line);
  color: var(--soft-ink);
}

.footer-links a {
  font-weight: 850;
}

.business-address {
  margin: 1rem 0 0;
  color: var(--soft-ink);
  font-style: normal;
  line-height: 1.5;
}

@media (max-width: 980px) {
  .site-header {
    align-items: flex-start;
    flex-direction: column;
  }

  nav {
    justify-content: flex-start;
  }

  .hero,
  .split-heading,
  .shop-section,
  .custom-section {
    grid-template-columns: 1fr;
  }

  .door-grid,
  .service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .app-gallery {
    grid-template-columns: 1fr;
  }

  .app-card-feature {
    grid-column: auto;
    grid-template-columns: 1fr;
  }
}

@media (max-width: 620px) {
  .site-header {
    position: static;
  }

  nav a {
    padding-inline: 0.45rem;
  }

  .hero-copy h1 {
    font-size: 3.05rem;
  }

  .section-heading h2,
  .shop-section h2,
  .custom-section h2,
  .about h2 {
    font-size: 2.35rem;
  }

  .door-grid,
  .service-grid {
    grid-template-columns: 1fr;
  }

  .door-card {
    min-height: auto;
  }

  .app-copy,
  .service-grid article {
    padding: 1rem;
  }

  .proof-strip{justify-content:flex-start;padding-inline:.2rem}.proof-strip span{width:100%;justify-content:center}.faq-grid{grid-template-columns:1fr}
}