:root {
      --navy: #082b44;
      --blue: #0b69a9;
      --sky: #dff3fb;
      --mist: #f4fafc;
      --aqua: #52c1c8;
      --sand: #f4c675;
      --ink: #17303f;
      --muted: #5b7180;
      --white: #fff;
      --line: #d6e5eb;
      --shadow: 0 20px 60px rgba(8, 43, 68, .14);
      --radius: 22px;
    }
    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: 96px; }
    body {
      margin: 0;
      color: var(--ink);
      background: var(--white);
      font: 16px/1.65 "DM Sans", system-ui, sans-serif;
    }
    a { color: inherit; }
    img { max-width: 100%; display: block; }
    button, input, select, textarea { font: inherit; }
    main [id] { scroll-margin-top: 104px; }
    .skip { position: absolute; left: -999px; top: 8px; z-index: 100; background: white; padding: 10px 16px; }
    .skip:focus { left: 8px; }
    .concept-bar {
      display: flex; align-items: center; justify-content: center; gap: 10px;
      min-height: 38px; padding: 7px 20px; text-align: center;
      color: #27495b; background: #fff4d8; font-size: 13px; font-weight: 700;
    }
    .concept-dot { width: 8px; height: 8px; border-radius: 50%; background: #e29526; box-shadow: 0 0 0 4px rgba(226,149,38,.16); }
    .topbar { background: var(--navy); color: white; font-size: 14px; }
    .wrap { width: min(1160px, calc(100% - 40px)); margin-inline: auto; }
    .topbar .wrap { min-height: 42px; display: flex; justify-content: space-between; align-items: center; gap: 24px; }
    .topbar .group { display: flex; align-items: center; gap: 24px; }
    .topbar a { text-decoration: none; opacity: .95; }
    .topbar a:hover { opacity: 1; text-decoration: underline; }
    .nav-shell { position: sticky; top: 0; z-index: 50; background: rgba(255,255,255,.96); border-bottom: 1px solid rgba(214,229,235,.9); backdrop-filter: blur(16px); }
    .nav { min-height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
    .nav > a[aria-label="Luxe Dental Care home"] { flex: 0 0 auto; }
    .logo { width: 166px; height: auto; }
    .nav-links { display: flex; align-items: center; gap: clamp(16px,1.5vw,24px); }
    .nav-links a { flex: 0 0 auto; color: #27495b; font-size: 14px; font-weight: 700; line-height: 1.35; text-decoration: none; white-space: nowrap; }
    .nav-links a:hover { color: var(--blue); }
    .nav-links .btn, .nav-links .btn:hover { color: white; }
    .btn {
      display: inline-flex; align-items: center; justify-content: center; gap: 9px;
      min-height: 48px; padding: 12px 20px; border: 1px solid transparent; border-radius: 999px;
      color: white; background: var(--blue); font-weight: 700; text-decoration: none; cursor: pointer;
      transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
    }
    .btn:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(11,105,169,.24); background: #075b95; }
    .btn.secondary { color: var(--navy); background: white; border-color: rgba(8,43,68,.22); }
    .btn.secondary:hover { box-shadow: 0 12px 28px rgba(8,43,68,.12); }
    .menu-button { display: none; border: 0; background: transparent; color: var(--navy); font-size: 27px; padding: 8px; cursor: pointer; }
    .hero {
      position: relative; isolation: isolate; min-height: 660px; display: grid; align-items: center; padding: 0;
      background: #dceff5 url("../hero-sailboat-couple-poster.jpg") 70% center / cover no-repeat;
      overflow: hidden;
    }
    .hero-media {
      position: absolute; inset: -3%; z-index: -4; width: 106%; height: 106%;
      object-fit: cover; object-position: 70% center;
      background: url("../hero-sailboat-couple-poster.jpg") 70% center / cover no-repeat;
      transition: opacity 1.55s cubic-bezier(.45,0,.2,1); will-change: opacity;
    }
    .hero-media.loop-dissolve { opacity: 0; }
    .hero-water-light {
      position: absolute; left: -7%; bottom: 0; z-index: -3; width: 70%; height: 58%; pointer-events: none;
      background:
        radial-gradient(ellipse at 18% 68%, rgba(255,255,255,.34) 0 1px, transparent 2px),
        radial-gradient(ellipse at 38% 42%, rgba(255,255,255,.26) 0 1px, transparent 2px),
        radial-gradient(ellipse at 58% 74%, rgba(255,255,255,.24) 0 1px, transparent 2px),
        radial-gradient(ellipse at 78% 36%, rgba(255,255,255,.22) 0 1px, transparent 2px);
      background-size: 98px 54px, 132px 72px, 118px 66px, 150px 80px;
      mix-blend-mode: screen; opacity: .34;
      -webkit-mask-image: linear-gradient(90deg, #000 0 75%, transparent 100%);
      mask-image: linear-gradient(90deg, #000 0 75%, transparent 100%);
      animation: hero-water-light 9s ease-in-out infinite alternate;
    }
    .hero.motion-paused .hero-water-light { animation-play-state: paused; }
    @keyframes hero-water-light {
      from { transform: translate3d(-1%,2px,0); opacity: .26; }
      to { transform: translate3d(2%,-3px,0); opacity: .48; }
    }
    .motion-toggle { position: absolute; right: 22px; bottom: 92px; z-index: 2; padding: 9px 13px; border: 1px solid rgba(255,255,255,.55); border-radius: 999px; color: white; background: rgba(5,31,49,.7); backdrop-filter: blur(7px); font-size: 12px; font-weight: 700; cursor: pointer; }
    .motion-toggle:hover,.motion-toggle:focus-visible { color: var(--navy); background: white; outline: none; }
    .hero::before { content: ""; position: absolute; inset: 0; z-index: -2; background: linear-gradient(90deg, rgba(5,31,49,.94) 0%, rgba(5,31,49,.85) 43%, rgba(5,31,49,.18) 58%, rgba(5,31,49,.04) 76%, rgba(5,31,49,.02) 100%); }
    .hero::after { content: ""; position: absolute; inset: auto -5% -110px; height: 180px; z-index: -1; background: white; border-radius: 50% 50% 0 0 / 100% 100% 0 0; }
    .hero-content { width: min(650px, 58%); color: white; padding: 82px 0 130px; }
    .eyebrow { display: inline-flex; align-items: center; gap: 10px; margin: 0 0 18px; color: #9ce7eb; font-size: 13px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
    .eyebrow::before { content: ""; width: 32px; height: 2px; background: var(--aqua); }
    h1, h2 { margin: 0; font-family: "Manrope", "DM Sans", system-ui, sans-serif; line-height: 1.08; letter-spacing: -.035em; font-variant-ligatures: none; font-feature-settings: "liga" 0, "clig" 0; }
    h1 { font-size: clamp(44px, 5.3vw, 72px); max-width: 760px; }
    .hero p { max-width: 590px; margin: 24px 0 30px; color: #e6f1f5; font-size: 18px; line-height: 1.7; }
    .actions { display: flex; gap: 12px; flex-wrap: wrap; }
    .actions .secondary { color: white; border-color: rgba(255,255,255,.55); background: rgba(255,255,255,.08); }
    .actions .secondary:hover { background: rgba(255,255,255,.18); }
    .trust-row { position: relative; z-index: 3; margin-top: -68px; }
    .trust-card { display: grid; grid-template-columns: repeat(4, 1fr); background: white; border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
    .trust-item { min-height: 132px; padding: 25px 28px; display: flex; flex-direction: column; justify-content: center; border-right: 1px solid var(--line); }
    .trust-item:last-child { border-right: 0; }
    .trust-item strong { color: var(--navy); font: 700 23px/1.15 "Manrope", "DM Sans", system-ui, sans-serif; letter-spacing: -.025em; }
    .trust-item span { margin-top: 6px; color: var(--muted); font-size: 14px; }
    .stars { color: #eba82f; letter-spacing: 2px; }
    section { padding: 100px 0; }
    .section-head { display: grid; grid-template-columns: .8fr 1.2fr; gap: 55px; align-items: end; margin-bottom: 42px; }
    .section-head h2, .split h2, .contact-panel h2 { color: var(--navy); font-size: clamp(36px, 4vw, 54px); }
    .contact-panel h2 { font-family: "Manrope", "DM Sans", system-ui, sans-serif; font-weight: 700; letter-spacing: -.04em; }
    .section-head p { margin: 0; color: var(--muted); font-size: 17px; }
    .services { background: linear-gradient(180deg, white, var(--mist)); }
    .service-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
    .service {
      position: relative; min-height: 255px; padding: 30px; background: white; border: 1px solid var(--line); border-radius: 18px;
      box-shadow: 0 8px 30px rgba(8,43,68,.06); transition: transform .2s ease, border-color .2s ease;
    }
    .service:hover { transform: translateY(-4px); border-color: #93cdda; }
    .icon { width: 48px; height: 48px; display: grid; place-items: center; border-radius: 14px; color: var(--blue); background: var(--sky); font-size: 23px; }
    .icon svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
    .icon img { width: 28px; height: 28px; display: block; object-fit: contain; }
    .service h3 { margin: 22px 0 9px; color: var(--navy); font-size: 21px; }
    .service p { margin: 0 0 18px; color: var(--muted); font-size: 14px; }
    .service a { color: var(--blue); font-weight: 700; text-decoration: none; }
    .service a:hover { text-decoration: underline; }
    .service-featured { grid-column: 1 / -1; min-height: 0; display: grid; grid-template-columns: 48px minmax(0,1fr) auto; gap: 20px; align-items: center; background: linear-gradient(135deg,#fff 0%,#eefaff 100%); }
    .service-featured .service-copy { min-width: 0; }
    .service-featured .service-label { display: block; margin-bottom: 5px; color: var(--blue); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
    .service-featured h3 { margin: 0 0 6px; }
    .service-featured p { max-width: 760px; margin: 0; }
    .service-featured > a { white-space: nowrap; }
    .care { background: var(--navy); color: white; }
    .split { display: grid; grid-template-columns: 1fr 1fr; gap: 72px; align-items: center; }
    .photo-card { position: relative; min-height: 540px; overflow: hidden; border-radius: 28px; box-shadow: 0 30px 70px rgba(0,0,0,.23); }
    .photo-card img { width: 100%; height: 540px; object-fit: cover; object-position: center 22%; }
    .photo-label { position: absolute; left: 24px; right: 24px; bottom: 24px; padding: 18px 20px; color: var(--ink); background: rgba(255,255,255,.94); border-radius: 16px; backdrop-filter: blur(10px); }
    .photo-label strong { display: block; color: var(--navy); font-size: 18px; }
    .care .eyebrow { color: #9ce7eb; }
    .care h2 { color: white; }
    .care-copy > p { color: #cbdde7; font-size: 17px; }
    .checks { display: grid; gap: 17px; margin: 28px 0 34px; }
    .check { display: grid; grid-template-columns: 28px 1fr; gap: 12px; color: #eaf4f7; }
    .check b { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--aqua); }
    .reviews { background: #eef9fb; }
    .review-grid { display: grid; grid-template-columns: 1.25fr .9fr .9fr; gap: 18px; }
    .review { padding: 30px; border-radius: 20px; background: white; border: 1px solid var(--line); }
    .review.featured { color: white; background: var(--blue); border-color: var(--blue); }
    .review h3 { margin: 18px 0 10px; color: var(--navy); font: 700 23px/1.25 "Manrope", "DM Sans", system-ui, sans-serif; letter-spacing: -.02em; }
    .review p { margin: 0; color: var(--muted); }
    .review.featured h3 { color: white; font-size: 29px; }
    .review.featured p { color: #dceef7; }
    .expect-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 14px; color: var(--blue); background: var(--sky); font-size: 20px; }
    .review.featured .expect-icon { color: var(--navy); background: var(--aqua); }
    .contact { background: white; }
    .contact-shell { display: grid; grid-template-columns: .9fr 1.1fr; border-radius: 28px; overflow: hidden; box-shadow: var(--shadow); border: 1px solid var(--line); }
    .contact-panel { padding: 52px; background: var(--mist); }
    .contact-panel p { color: var(--muted); }
    .details { margin-top: 30px; display: grid; gap: 18px; }
    .detail { min-height: 42px; display: grid; grid-template-columns: 40px minmax(0,1fr); gap: 14px; align-items: center; }
    .detail b { width: 40px; height: 40px; display: grid; place-items: center; border-radius: 11px; color: var(--blue); background: var(--sky); font-size: 16px; }
    .detail b i { line-height: 1; }
    .detail span { display: block; line-height: 1.45; }
    .detail a { color: inherit; overflow-wrap: anywhere; text-decoration-thickness: 1px; text-underline-offset: 2px; }
    .demo-form { padding: 52px; background: white; }
    .demo-form h3 { margin: 0 0 8px; color: var(--navy); font-size: 25px; }
    .demo-form > p { margin: 0 0 24px; color: var(--muted); font-size: 14px; }
    .booking-points { display: grid; gap: 12px; margin: 24px 0 28px; }
    .booking-point { display: grid; grid-template-columns: 26px 1fr; gap: 10px; align-items: start; color: #385569; }
    .booking-point b { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; color: var(--navy); background: var(--aqua); }
    .field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
    label { display: grid; gap: 7px; color: #385569; font-size: 13px; font-weight: 700; }
    label.full { grid-column: 1 / -1; }
    input, select, textarea { width: 100%; min-height: 48px; padding: 11px 13px; color: var(--ink); background: white; border: 1px solid #bdcfd8; border-radius: 10px; }
    input:focus, select:focus, textarea:focus { outline: 3px solid rgba(82,193,200,.28); border-color: var(--aqua); }
    textarea { min-height: 100px; resize: vertical; }
    .form-note { margin: 13px 0 18px; color: var(--muted); font-size: 12px; }
    .demo-message { display: none; margin-top: 14px; padding: 12px; color: #215c3a; background: #e8f8ee; border-radius: 10px; font-weight: 700; }
    footer { padding: 55px 0 28px; color: #d8e7ee; background: #061f31; }
    .footer-grid { display: grid; grid-template-columns: 1.2fr 1fr 1fr 1fr; gap: 45px; }
    .footer-logo { width: 165px; height: auto; }
    footer p, footer a { color: #a9c0cc; font-size: 14px; }
    footer a { display: block; margin: 7px 0; text-decoration: none; }
    footer a:hover { color: white; }
    footer h3 { margin: 0 0 12px; color: white; font-size: 15px; }
    footer address { margin-top: 16px; color: #a9c0cc; font-style: normal; font-size: 14px; line-height: 1.65; }
    footer address a { display: inline; margin: 0; }
    .legal { margin-top: 38px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.12); display: flex; justify-content: space-between; gap: 20px; color: #7f9baa; font-size: 12px; }
    .mobile-actions { display: none; }
    @media (max-width: 1160px) {
      .menu-button { display: block; }
      .nav-links { display: none; position: absolute; top: 84px; left: 20px; right: 20px; max-height: calc(100vh - 110px); max-height: calc(100dvh - 110px); padding: 20px; overflow-y: auto; overscroll-behavior: contain; background: white; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); flex-direction: column; align-items: stretch; }
      .nav-links.open { display: flex; }
      .nav-links a:not(.btn) { min-height: 44px; display: flex; align-items: center; padding: 10px 8px; }
      .nav-links .btn { width: 100%; }
    }
    @media (max-width: 940px) {
      .topbar .hours { display: none; }
      .hero { min-height: 630px; background-position: 60% center; }
      .hero::before { background: linear-gradient(90deg, rgba(5,31,49,.94), rgba(5,31,49,.72)); }
      .hero-content { width: 80%; }
      .trust-card { grid-template-columns: repeat(2, 1fr); }
      .trust-item:nth-child(2) { border-right: 0; }
      .trust-item:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
      .section-head, .split, .contact-shell { grid-template-columns: 1fr; }
      .service-grid { grid-template-columns: repeat(2, 1fr); }
      .service-featured { grid-template-columns: 48px minmax(0,1fr); }
      .service-featured > a { grid-column: 2; justify-self: start; }
      .review-grid { grid-template-columns: 1fr 1fr; }
      .review.featured { grid-column: 1 / -1; }
      .footer-grid { grid-template-columns: 1fr 1fr; }
    }
    @media (max-width: 620px) {
      .wrap { width: min(100% - 28px, 1160px); }
      .concept-bar { font-size: 11px; }
      .topbar .group { gap: 12px; }
      .topbar .email { display: none; }
      .nav { min-height: 72px; }
      .nav-links { top: 72px; }
      .logo { width: 138px; }
      .hero { min-height: 620px; align-items: end; background-position: 67% center; }
      .hero::before { background: linear-gradient(0deg, rgba(5,31,49,.96) 0%, rgba(5,31,49,.86) 62%, rgba(5,31,49,.28) 100%); }
      .hero-content { width: 100%; padding: 150px 0 95px; }
      .hero p { font-size: 16px; }
      .hero-content .actions { display: none; }
      .trust-row { margin-top: -45px; }
      .trust-item { min-height: 112px; padding: 18px; }
      .trust-item strong { font-size: 20px; }
      section { padding: 72px 0; }
      .section-head { gap: 18px; }
      .service-grid, .review-grid, .field-grid, .footer-grid { grid-template-columns: 1fr; }
      .service-featured { grid-column: auto; grid-template-columns: 1fr; gap: 14px; }
      .service-featured > a { grid-column: auto; }
      .review.featured { grid-column: auto; }
      .split { gap: 38px; }
      .photo-card, .photo-card img { min-height: 430px; height: 430px; }
      .contact-panel, .demo-form { padding: 30px 24px; }
      .legal { flex-direction: column; }
      body { padding-bottom: calc(74px + env(safe-area-inset-bottom)); }
      .mobile-actions { position: fixed; z-index: 80; left: 0; right: 0; bottom: 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; padding: 8px 8px calc(8px + env(safe-area-inset-bottom)); background: white; border-top: 1px solid var(--line); box-shadow: 0 -8px 30px rgba(8,43,68,.12); }
      .mobile-actions .btn { min-width: 0; min-height: 50px; padding: 8px 6px; border-radius: 10px; font-size: 12px; white-space: nowrap; }
    }
    @media (max-width: 620px) and (max-height: 700px) {
      .hero-content { padding: 80px 0 165px; }
    }
    @media (max-width: 360px) and (max-height: 700px) {
      .hero-content { padding: 14px 0 231px; }
    }
    .home-awards{padding:34px 0 4px;background:white}.award-ribbon{display:grid;grid-template-columns:1fr auto auto;gap:24px;align-items:center;padding:24px 28px;border:1px solid var(--line);border-top:4px solid var(--sand);border-radius:20px;background:linear-gradient(100deg,#fff 0%,#f5fbfd 100%);box-shadow:0 12px 35px rgba(8,43,68,.09)}.award-ribbon-copy .eyebrow{margin-bottom:6px;color:var(--blue)}.award-ribbon-copy h2{color:var(--navy);font-size:clamp(25px,2.8vw,36px)}.award-ribbon-copy a{display:inline-block;margin-top:8px;color:var(--blue);font-size:13px;font-weight:700;text-decoration:none}.award-ribbon-copy a:hover{text-decoration:underline}.home-award{display:grid;grid-template-columns:90px 180px;gap:15px;align-items:center;padding-left:24px;border-left:1px solid var(--line)}.home-award img{width:90px;height:70px;object-fit:contain}.home-award.best-dentist{grid-template-columns:58px 165px}.home-award.best-dentist img{width:58px}.home-award strong{display:block;color:var(--navy);font-size:15px}.home-award span{display:block;color:var(--muted);font-size:12px;line-height:1.45}.home-awards+.trust-row{margin-top:28px}
    .top-social{display:flex;align-items:center;gap:7px}.top-social a{display:grid;width:30px;height:30px;place-items:center;border:1px solid rgba(255,255,255,.38);border-radius:50%;text-decoration:none}.top-social img{width:15px;height:15px;display:block;filter:brightness(0) invert(1)}.top-social a:hover,.top-social a:focus-visible{background:white;text-decoration:none;outline:none}.top-social a:hover img,.top-social a:focus-visible img{filter:none}
    @media(max-width:620px){.topbar .wrap{justify-content:center}.topbar .group:first-child{display:none}.topbar .group:last-child{gap:12px}.topbar .group:last-child>span{display:none}.topbar .group:last-child>a{display:none}}
    @media(max-width:900px){.award-ribbon{grid-template-columns:1fr 1fr}.award-ribbon-copy{grid-column:1/-1}.home-award{border-left:0;padding-left:0}}
    @media(max-width:620px){.award-ribbon{grid-template-columns:1fr;padding:22px}.award-ribbon-copy{grid-column:auto}.home-award,.home-award.best-dentist{grid-template-columns:72px 1fr;padding-top:18px;border-top:1px solid var(--line)}.home-award img,.home-award.best-dentist img{width:72px;height:58px}}
    @media(max-width:980px){.hero-media{object-position:78% center}}
    @media(max-width:620px){.hero-media{object-position:82% center}.motion-toggle{top:14px;right:14px;bottom:auto}}