:root {
    --ink: #10201f;
    --navy: #0f3f3b;
    --band: #134e4a;
    --band2: #0d3b38;
    --action: #0f766e;
    --actionh: #115e59;
    --teal-ink: #0f766e;
    --teal-lt: #5eead4;
    --soft: #f2f5f6;
    --silver: #e4e9ec;
    --tint: #e3f1ef;
    --tinth: #cfe6e2;
    --line: #d5dce0;
    --mut: #4b5a63;
    --open: #0f766e;
    --openring: rgba(15,118,110,.22);
    --closed: #475569;
    --p: #0f766e;
    --pd: #134e4a
}

@font-face {
    font-family: "Inter";
    font-style: normal;
    font-weight: 400 800;
    font-display: swap;
    src: url("./inter-latin.woff2") format("woff2");
    unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD
}

:root {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

*,*::before,*::after {
    box-sizing: border-box
}

html {
    scroll-behavior: smooth;
    -webkit-text-size-adjust: 100%;
    scroll-padding-top: 100px
}

body {
    margin: 0;
    font-family: "Inter","Noto Sans Gurmukhi","Nirmala UI","Gurmukhi Sangam MN",system-ui,sans-serif;
    font-size: 16px;
    line-height: 1.6;
    color: var(--ink);
    /* background: #fff; */
    overflow-x: hidden
}

h1,h2,h3,p,ul,ol,dl,dd {
    margin: 0
}

ul,ol {
    padding: 0;
    list-style: none;
}

img,svg,iframe {
    display: block;
    max-width: 100%;
    width: 48px;
    height: 48px;
    max-width: 184px;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font: inherit;
    cursor: pointer
}

:focus-visible {
    outline: 3px solid #043430;
    outline-offset: 3px;
    border-radius: 6px
}

.skip {
    position: absolute;
    left: 12px;
    top: -60px;
    background: #fff;
    color: var(--ink);
    padding: 10px 14px;
    border-radius: 8px;
    z-index: 100;
    font-weight: 600
}

.skip:focus {
    top: 12px
}

.wrap {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 24px;
}

.ic,.ar,.fi,.mi,.ei,.qi,.mfi {
    flex: none
}

.ar {
    width: 18px;
    height: 18px;
    /* color: #fff; */
    /* background: #fff; */
    /* stroke: rgb(100 100 100); */
}

.ck {
    width: 18px;
    height: 18px
}

.ls {
    display: none
}

/* header = brand-line component (brand-line.css) + actions */
.hd {
    position: sticky;
    top: 0;
    z-index: 50;
    background: #fff;
    border-bottom: 1px solid var(--line)
}

.hd-in {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: 76px
}

.bl {
    min-height: auto;
}

.bl-mark {
    background: #fff;
    padding: 6px;
    box-shadow: 0 0 0 1px var(--line);
    object-fit: contain
}

.bl-who b {
    font-size: 18px
}

.nav {
    display: none;
    gap: 22px;
    font-weight: 600;
    font-size: 15px;
    color: var(--ink);
    flex: none
}

.nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
    padding: 0 6px;
    border-bottom: 2px solid transparent;
    transition: color .18s,border-color .18s
}

.nav a:hover {
    color: var(--actionh);
    border-color: var(--actionh)
}

.hd-acts {
    display: inline-flex;
    align-items: flex-end;
    gap: 10px;
    flex: none;
    align-content: flex-start;
    justify-content: space-evenly;
    grid-auto-flow: column;
}

.login {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 100px;
    font-weight: 600;
    font-size: 15px;
    padding: 0 10px;
    /* color: var(--ink); */
    transition: color .18s;
    background: #f5f5f5;
    border-color: #353535;
    color: #ffffff;
    border-radius: 6px;
    border-color: #000000;
    color: #fff;
    /* background: linear-gradient(135deg, #1b6955, #06352cf5); */
    /* background-color: #000000 !important; */
    background: linear-gradient(176deg, #026e6e, #004638f5);
    /* color: var(--actionh); */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    /* min-height: 46px; */
    padding: 0 24px;
    border-radius: 6px;
    font: inherit;
    font-size: 15px;
    font-weight: 700;
    text-decoration: none;
    border: 1px solid #efefef;
    white-space: nowrap;
    transition: none;
    cursor: pointer;
    color: #ffffff;
    border: 0px solid #616161;
    /* border-radius: 6px; */
    /* background: #17604e; */
    /* border: 1px solid #edededbd; */
    /* border-radius: 6px; */
    /* background: var(--soft); */
    /* min-height: 46px; */
}

.login:hover {
    color: #ffffff;
    /* text-decoration: underline; */
    /* text-underline-offset: 4px; */
    /* background: #00461f; */
    /* border-color: #353535; */
    background: #387f72;
    /* background: linear-gradient(176deg, #026e6e, #004638f5); */
    color: #ffffff;
    /* border-color: #0b736a; */
    color: #e7fff1;
    /* background: linear-gradient(259deg, #002220, #2b2b2bf5); */
    background: linear-gradient(176deg, #167474, #064f40f5);
    border-color: #fbfbfb;
    color: #ffffff;
}

/* design-1028 R8b: the language control is a small dropdown like /book's language menu. Phones and tablets use the <select>
   (their own picker); desktops get the menu app.js builds from it (.lang.is-menu). 4px corners. */
.lang {
    position: ;
    /* flex: none; */
    /* top: 0; */
    /* bottom: auto; */
    /* left: 0; */
    /* right: 0; */
}

.lang-sel,.lang-trig {
    display: inline-flex;
    /* align-items: center; */
    gap: 2px;
    height: 44px;
    margin: 0;
    padding: 0 4px 0 14px;
    border: 1px solid #edededbd;
    border-radius: 6px;
    background: var(--soft);
    color: var(--ink);
    font: inherit;
    font-size: 13.5px;
    font-weight: 700;
    line-height: 1.2;
    cursor: pointer;
    transition: background-color .18s;
    justify-content: space-between;
    min-width: 70px;
    /* background: #f7f7f7; */
    color: var(--ink);
    border: 1px solid #f5f5f5bd;
    /* min-width: 89px; */
*/
    border: 1px solid #edededbd;
    border-radius: 6px;
    background: var(--soft);
    color: var(--ink);
    /* min-height: 46px; */
    display: inline-flex;
    gap: 5px;
    /* height: 40px; */
    margin: 0;
    padding: 3px 5px 0px 5px;
    border: 0px solid #f9f9f9;
    border-radius: 6px;
    background: #efefef;
    color: #2f353b;
    /* font: inherit; */
    /* font-size: 13.5px; */
    /* font-weight: 700; */
    /* line-height: 1.2; */
    cursor: pointer;
    transition: none;
    /* min-height: 46px; */
    /* padding: 0 24px; */
    flex-wrap: wrap;
    width: -webkit-fill-available;
    /* align-items: flex-end; */
    justify-content: center;
    background-color: transparent;
    border: 1px solid #ebebeb00;
    background: #f2f2f200;
    /* color: #2f353b; */
    /* border: 1px solid #f9f9f9bd; */
    border-radius: 6px;
    background: #f9f9f978;
    border: 0px solid #f0f0f021;
    border-radius: 6px;
    background: #fdfdfd;
    padding: 14px 16px 11px 13px;
    /* align-content: center; */
    /* border: 1px solid #edededbd; */
    border-radius: 4px;
    background: #f4f4f4;
    color: var(--ink);
}

.lang-sel {
    -webkit-appearance: none;
    appearance: none;
    padding-right: 36px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f766e' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E") no-repeat right 12px center/16px 16px,var(--soft)
}

.lang-sel:hover,.lang-trig:hover,.lang.open .lang-trig {
    color: #fff;
    background-color: #070707;
    /* background: #9a9a9a; */
    border-color: #ececec;
    /* color: #043e01; */
    background: linear-gradient(176deg, #167474, #064f40f5);
    border-color: #0b5a50;
    /* color: #ffffff; */
    /* color: var(--actionh); */
    /* background: var(--silver); */
    /* box-shadow: 0 14px 34px -10px rgba(13, 59, 56, .4); */
    outline: 0px solid #136a65;
    background-color: #000 !important;
    background-color: #000 !important;
    box-shadow: none;
}

.lang-trig:focus-visible {
    border-radius: 4px
}

.lang.is-menu .lang-sel {
    display: none;
}

.lang-trig svg {
    /* width: 16px; */
    /* height: 16px; */
    /* flex: none; */
    color: revert-layer;
    /* width: 16px; */
    /* height: 16px; */
    /* flex: none; */
    color: var(--action);
    color: wheat;
    color: #0f766e;
    width: 16px;
    height: 16px;
    /* flex: none; */
    /* color: currentColor; */
    /* color: seashell; */
    color: #5bb39a;
    color: #0f766e;
    color: #0f766e;
}

.lang.open .lang-trig {
    border-radius: 6px 6px 0 0;
    /* box-shadow: inset 0px 0px 1px 1px rgb(0 0 0); */
    /* z-index: 555555; */
    position: relative;
}

.lang.open .lang-trig svg {
    transform: rotate(180deg);
    color: bisque;
    color: #ffe4b8;
}

.lang-opts {
    position: fixed;
    top: auto;
    right: auto;
    z-index: 60;
    min-width: 70px;
    margin: 0;
    /* left: 0; */
    /* width: auto; */
    /* right: 0; */
    padding: initial;
    /* list-style: none; */
    background: transparent;
    border-radius: 0px 0px 6px 6px;
    box-shadow: 0px 0px 0px 1px rgb(149 149 149 / 9%);
    overflow: hidden;
    width: inherit;
    background-color: transparent;
    border: 0;
    outline: 0;
    border-radius: 0 0 9px 9px;
    /* box-shadow: 0px 0px 0px 1px rgb(255 255 255); */
    /* outline: 1px solid #3d3d3d; */
    /* width: auto; */
}

.lang-opts:focus {
    /* outline: none; */
}

.lang-opts li {
    padding: 11px 14px 11px 5px;
    /* border-left: 3px solid transparent; */
    font-size: 13.5px;
    /* font-weight: 600; */
    /* line-height: 1.3; */
    color: var(--ink);
    /* white-space: nowrap; */
    cursor: pointer;
    padding: 11px 16px 11px 13px;
    /* border-left: 0px solid transparent; */
    /* font-size: 13.5px; */
    /* font-weight: 600; */
    /* line-height: 1.3; */
    /* color: var(--ink); */
    /* white-space: nowrap; */
    cursor: pointer;
    /* background: #b51111; */
    /* overflow: hidden; */
    /* background-color: #000 !important; */
    /* border: 0; */
    background-color: #ffffff;
    /* color: #fff; */
    /* background: #3d3d3d !important; */
}

.lang-opts li+li {
    border-top: 1px solid #000000bd;
}

.lang-opts li[aria-selected="true"] {
    border-left-color:var(--action);
    font-weight: 700;
    background: #ffffff;
}

.lang-opts li.is-act {
    background: #3a3a3a;
    /* background: #414141; */
    /* border-color: #bd9292; */
    color: #ffffff;
    /* background-color: transparent; */
}

.lang-opts:focus-visible li.is-act {
    /* box-shadow: inset 0 0 0 2px var(--action); */
}

.dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    flex: none;
    background: var(--closed)
}

html[data-open="open"] .dot {
    background: var(--open);
    box-shadow: 0 0 0 4px var(--openring)
}

/* buttons */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    height: 44px;
    padding: 0 22px;
    border-radius: 5px;
    font-weight: 700;
    font-size: 15px;
    border: 1px solid transparent;
    transition: none;
    white-space: nowrap
}

.btn-sm {
    height: 44px;
    padding: 0 16px;
    /* font-size: 14px; */
    border-radius: 8px;
}

.btn-lg {
    height: 54px;
    padding: 0 26px;
    font-size: 16px;
    border-radius: 6px;
}

.btn-p {
    /* background:var(--action); */
    /* color:#fff; */
    /* border-color: #160707; */
    background: #ffeaca;
    border-bottom: 0px solid #000000;
    /* color: var(--ink); */
    /* border: 1px solid #ede6d9; */
    border-radius: 11px;
    border-radius: 6px;
    /* background-color: transparent; */
    /* background: #fff2db; */
    /* border: 1px solid #d4d4d4; */
    background: linear-gradient(316deg, #ffdfab, #ffeaca);
    /* background: linear-gradient(311deg, #fff2db, #ffedd1); */
    color: #032b29;
    width: auto;
    flex: auto;
    /* color: var(--ink); */
    /* background: #f7ecd9; */
    background: linear-gradient(316deg, #ffdfab, #ffeaca);
    border: 1px solid #ffdea9;
    /* box-shadow: inset 0px 0px 0px 1px rgb(255 234 202); */
    /* font-size: 13.5px; */
    /* line-height: 1.3; */
    /* background: #fff; */
    min-height: 44px;
    /* background: linear-gradient(311deg, #fff2db, #ffedd1); */
    color: var(--ink);
    border: 1px solid #d2d2d2;
    border-radius: 6px;
    border-bottom: 1px solid #d2d2d2;
    background: linear-gradient(332deg, #f7ecd9, #fff8ed);
    /* min-height: 46px; */
}

.btn-p:hover {
    background: var(--actionh);
    border-color: var(--actionh);
    /* background: #454545; */
    /* border-color: #454545; */
    /* color: #ffffff; */
    background: #454545;
    border-color: #353535;
    color: #ffffff;
    background: #454545;
    border-color: #353535;
    color: #ffffff;
}

.btn-o {
    /* background: #033e3a; */
    color: #ffffff;
    border-color: #374a48;
    color: #fff;
    background: linear-gradient(135deg, #1b6955, #06352cf5);
    /* background-color: #dfdfdf !important; */
    /* border: 0; */
    outline: 0;
    box-shadow: none !important;
    border: 0 !important;
    CONTAIN-INTRINSIC-BLOCK-SIZE: AUTO 100PX;
    border-radius: 6px;
    /* outline: 0 !important; */
    box-shadow: none !important;
    /* margin-left: auto; */
    width: auto;
    flex: auto;
    min-height: 46px;
    /* height: 54px; */
    padding: 0 26px;
    font-size: 14px;
    width: 100%;
    width: 100%;
    width: 100%;
}

.btn-o:hover {
    /* background: #ffffff; */
    color: var(--actionh);
    border-color: #e4e4e4;
    background: #f7ecd9;
    /* border-bottom: 1px solid var(--line); */
    color: #ececec;
    background: linear-gradient(135deg, #128b6c, #0b6250f5);
    color: #eefff5;
    /* width: -webkit-fill-available; */
}

.btn-w {
    background: #fff;
    color: var(--band);
    border-color: #fff
}

.btn-w:hover {
    background: #cfdedc;
    border-color: #cfdedc
}

/* hero */
.hero {
    background: var(--soft);
    padding: 32px 0 52px;
    border-bottom: 1px solid var(--line);
    background: var(--soft);
}

.hero-in {
    display: inline-grid;
    gap: 30px;
    width: -webkit-fill-available;
    /* display: grid; */
    /* display: grid; */
    gap: 50px;
    /* width: -webkit-fill-available; */
    justify-content: center;
    grid-auto-flow: dense;
    /* justify-items: center; */
}

.eyebrow {
    /* display: inline-flex; */
    /* align-items: center; */
    /* gap: 8px; */
    /* font-weight: 700; */
    /* font-size: 13.5px; */
    /* color: var(--teal-ink); */
    /* background: #fff; */
    /* border: 1px solid var(--line); */
    /* border-radius: 999px; */
    /* padding: 6px 14px 6px 10px; */
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #ffffff;
    margin-bottom: 22px;
    display: flex;
    align-items: center;
    gap: 12px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #ffffff;
    margin-bottom: 22px;
}
.eyebrow::before {
    width: 16px;
    height: 16px;
    border-radius: 0;
    background: #4ba4e3;
    -webkit-mask: url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.4-4.5-9.5-9.3C1 8.2 3.1 4.6 6.7 4.6c2 0 3.4 1.1 4.3 2.5h2c.9-1.4 2.3-2.5 4.3-2.5 3.6 0 5.7 3.6 4.2 7.1C19.4 16.5 12 21 12 21z'/%3E%3C/svg%3E) center / contain no-repeat;
    mask: url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.4-4.5-9.5-9.3C1 8.2 3.1 4.6 6.7 4.6c2 0 3.4 1.1 4.3 2.5h2c.9-1.4 2.3-2.5 4.3-2.5 3.6 0 5.7 3.6 4.2 7.1C19.4 16.5 12 21 12 21z'/%3E%3C/svg%3E) center / contain no-repeat;
}
.ei {
    width: 16px;
    height: 16px
}

h1 {
    margin-top: 18px;
    font-size: clamp(2.2rem,9vw,4rem);
    line-height: 1.04;
    letter-spacing: -.038em;
    font-weight: 800;
    color: var(--navy);
    max-width: 11em
}

.lede {
    text-wrap: pretty;
    margin-top: 16px;
    font-size: 1.1rem;
    line-height: 1.6;
    color: var(--mut);
    max-width: 30em
}

.cta {
    display: inline-flex;
    /* gap: 13px; */
    /* margin-top: 26px; */
    /* width: auto; */
    /* flex: auto; */
    align-items: center;
    align-content: center;
    width: auto;
    width: -webkit-fill-available;
    /* display: inline-flex; */
    gap: 12px;
    margin-top: 26px;
    align-content: stretch;
    /* width: -webkit-fill-available; */
    align-items: stretch;
    display: inline-flex;
    gap: 12px;
    margin-top: 26px;
    align-content: stretch;
    width: -webkit-fill-available;
    align-items: stretch;
    flex-wrap: wrap;
    /* justify-content: flex-start; */
    /* flex-direction: column; */
}


.trio {
    display: inline-grid;
    margin-top: 30px;
    border-top: 1px solid #e7e7e7f5;
    width: fit-content;
    border-radius: 2px;
    justify-items: center;
    flex-wrap: wrap;
    flex-direction: row;
    grid-auto-flow: dense;
    gap: 13px;
    align-content: start;
    align-items: flex-start;
    justify-content: space-between;
    display: flex;
    grid-template-columns: repeat(3,auto);
    width: inherit;
    width: 100%;
    width: -webkit-fill-available;
}


.trio li {
    padding: 11px 20px 0 0;
    margin-right: 11px;
    border-right: 1px solid #d3d3d340;
    border-radius: 2px;
    background: #fdfdfd;
    display: inline-grid;
    gap: 7px;
    width: max-content;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: flex-start;
}

.trio li:last-child {
    border-right: 0;
    margin-right: 0;
    width: -webkit-fill-available;
    display: contents;
    align-items: center;
    justify-items: center;
    justify-content: start;
    align-content: stretch;
}

.trio .hl {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--teal-ink)
}

.trio .hv {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    font-weight: 700;
    color: var(--ink);
    line-height: 1.35
}

.hero-p {
    position: relative;
    /* width: -webkit-fill-available; */
}

.photo {
    border-radius: 28px;
    overflow: hidden;
    aspect-ratio: 4/3;
    background: var(--silver);
    box-shadow: 0 24px 60px -26px rgba(13,59,56,.5);
}

.photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    width: -webkit-fill-available;
    max-width: unset;
    object-position: initial;
    width: 100%;
    height: 100%;
    object-fit: cover;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: isplay: block;
    max-width: 100%;
    display: block;
    max-width: 100%;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.chip {
    position: absolute;
    display: flex;
    align-items: center;
    gap: 12px;
    background: #fff;
    border-radius: 16px;
    padding: 12px 16px;
    box-shadow: 0 14px 34px -10px rgba(13,59,56,.4);
    font-size: 13.5px;
    line-height: 1.3;
    background: #fff;
}

.chip b {
    display: block;
    font-weight: 700;
    font-size: 14.5px;
    color: var(--navy);
}

.chip span[data-live-hours] {
    color: var(--mut)
}

.chip-s {
    left: 14px;
    bottom: 14px
}

.chip-d {
    right: 14px;
    top: 14px;
    min-height: 48px;
    padding: 8px 16px 8px 10px;
    border-radius: 999px;
    transition: background-color .18s
}

.chip-d:hover {
    background: var(--silver);
    /* box-shadow: 0 14px 34px -10px rgba(13, 59, 56, .4); */
}

.chip-d b {
    display: inline
}

.avs {
    display: flex
}

.av {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #0f0e0e;
    color: #fff;
    font-weight: 800;
    letter-spacing: .02em
}

.av.sm {
    width: 32px;
    height: 32px;
    font-size: 11px;
    border: 2px solid #fff
}

.av.sm + .av.sm {
    margin-left: -5px;
    background: var(--action)
}

/* trust */
.trust {
    padding: 28px 0 8px;
    /* background: #087870; */
    /* background: linear-gradient(135deg, #1a252b, #002126); */
}

.trust-in {
    display: grid;
    /* gap: 14px; */
    border-radius: 21px;
}

.tr {
    display: flex;
    gap: 16px;
    background: #ffffff;
    /* border:1px solid var(--line); */
    /* border-radius: 20px; */
    padding: 18px 20px;
    /* background: #ffebc9; */
    /* border-bottom: 1px solid #f5f5f5; */
    color: var(--ink);
    /* border: 0px solid #e9e9e9; */
    /* display: flex; */
    /* border-radius: 11px; */
    /* background: linear-gradient(
71deg, #fff5e4, #f5e0c0); */
    align-content: flex-start;
    flex-wrap: wrap;
    flex-direction: row;
    align-items: flex-start;
    width: -webkit-fill-available;
    border: 1px solid var(--band);
    /* border-radius: 5px; */
    overflow: hidden;
    box-shadow: 0 22px 50px -20px rgb(213 213 213);
}

.tr h2 {
    font-size: 1.02rem;
    font-weight: 700;
    color: var(--navy);
    line-height: 1.3;
    letter-spacing: 0
}

.tr p {
    font-size: 14.5px;
    color: var(--mut);
    line-height: 1.5;
    margin-top: 2px
}

.tri {
    width: 48px;
    height: 48px;
    border-radius: 14px;
    background: #046059;
    display: grid;
    place-items: center;
    color: #ffffff;
    flex: none;
    <
    section class="tk-sec" aria-label="Appointments"><div class="wrap"><div class="tkwrap"><article class="tk v1" aria-label="Book an appointment"><div class="tk-l"><div class="tk-brand"><span class="mark"><img src="/v1/assets/mark-card.svg" alt="" width="64" height="64"></span><p class="tk-name">Derry Village Clinic</p></div><p class="tk-lab" data-i="tk_doctors">Doctors</p><p class="tk-doc">Dr. Bushra Farooq</p><p class="tk-doc">Dr. C. Farooq Masud</p><p class="tk-lab" data-i="tk_addr">Clinic address</p><p class="tk-addr">7070 St Barbara Blvd #2<br>Mississauga, ON L5W 0E6</p><a class="tk-a" href="https: //www.google.com/maps/dir/?api=1&amp;destination=7070+St+Barbara+Blvd+%232%2C+Mississauga%2C+ON+L5W+0E6" target="_blank" rel="noopener"><span data-i="directions">Get Directions</span></a><a class="tk-map" href="https://www.google.com/maps/search/?api=1&amp;query=7070+St+Barbara+Blvd+%232%2C+Mississauga%2C+ON+L5W+0E6" target="_blank" rel="noopener"><span data-i="gmaps">Google Maps</span></a></div><div class="tk-m"><p class="tk-kicker" data-i="tk_kicker">In-person appointments</p><h3 class="tk-when" data-i="tk_when">Book your visit online</h3><p class="tk-addr">7070 St Barbara Blvd #2, Mississauga, ON L5W 0E6</p><p class="tk-hr"><b data-i="wk">Mon to Fri</b> <span data-i="t_wk">9: 30 AM - 7:00 PM</span><br><b data-i="sat">Saturday</b> <span data-i="t_sat">9:00 AM - 2:00 PM</span></p><a class="tk-a" href="https://www.google.com/maps/dir/?api=1&amp;destination=7070+St+Barbara+Blvd+%232%2C+Mississauga%2C+ON+L5W+0E6" target="_blank" rel="noopener"><span data-i="directions">Get Directions</span></a><div class="tk-btns"><a href="/book"><span data-i="book">Book online</span></a><a href="tel:+19055659100"><span data-i="call">Call</span> (905) 565-9100</a></div></div><div class="tk-r"><div class="tk-check"><svg viewBox="0 0 24 24" fill="none" aria-hidden="true"><path d="M5 12.5 L10 17.5 L19.5 6.5" stroke="currentColor" stroke-width="2.25" stroke-linecap="round" stroke-linejoin="round"></path></svg></div><p class="tk-ok" data-i="tk_ok">Online booking</p></div></article></div></div></section>;
    background: #f7ecd9;
    border-bottom: 1px solid var(--line);
    color: var(--ink);
    border-radius: 14px;
    background: #005356;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.tri svg {
    width: 26px;
    height: 26px
}

.tr2 {
    flex-wrap: unset;
}

.tr2 .btn {
    margin-left: auto
}

/* ticket CTA band */
.band {
    background: #f2f5f6;
    padding: 60px 0 64px;
    margin-top: 40px
}

.band-h h2 {
    /* color: #fff; */
}

.band-h p {
    margin-top: 10px;
    /* color: #d6e8e5; */
}

.tk {
    margin-top: auto;
    display: grid;
    /* background: #fff; */
    border: 0px solid #E9E9E8;
    border-radius: 28px;
    overflow: hidden;
    box-shadow: 0 22px 50px -20px rgba(0,0,0,.45);
    color: var(--ink)
}

.tk-l {
    background: var(--band2);
    color: #fff;
    padding: 28px 24px 26px;
    display: flex;
    flex-direction: column;
    align-items: flex-start
}

.tk-l .logo {
    height: 40px;
    width: auto;
    max-width: 100%
}

.tk-lab {
    margin-top: 24px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #a7d6cf
}

.tk-doc {
    margin-top: 4px;
    font-size: 1.12rem;
    font-weight: 700;
    color: #fff;
    line-height: 1.35
}

.tk-l .tk-addr {
    margin-top: 4px;
    font-size: 14.5px;
    line-height: 1.5;
    color: #fff
}

.tk-a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin-top: 6px;
    font-weight: 700;
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
    text-decoration-thickness: 1.5px;
    transition: color .18s
}

.tk-a:hover {
    color: #bfe3dd
}

.tk-map {
    margin-top: 14px;
    display: inline-flex;
    height: 48px;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    border-radius: 10px;
    background: var(--action);
    border: 2px solid #fff;
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    transition: background-color .18s
}

.tk-map:hover {
    background: var(--actionh)
}

.tk-m {
    padding: 30px 24px 8px;
    border-top: 2px dashed #b9c7ca;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0
}

.tk-kicker {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--mut)
}

.tk-when {
    margin-top: 6px;
    font-size: 1.55rem;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.02em;
    color: var(--navy)
}

.tk-addr2 {
    margin-top: 12px;
    font-size: 14.5px;
    color: var(--mut)
}

.tk-hr {
    margin-top: 8px;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--mut)
}

.tk-hr b {
    color: var(--ink)
}

.tk-btns {
    margin-top: 22px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    width: 100%;
    max-width: 420px
}

.tk-btns .btn {
    height: 50px
}

.tk-r {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 22px 24px 26px
}

.tk-ok {
    font-size: 14.5px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .04em;
    color: var(--navy);
    text-align: center
}

/* sections */
.sec {
    padding: 64px 0;
}

.sec.soft {
    background: #fff7ea;
    padding-top: 62px;
    padding-bottom: 72px;
    /* background: var(--ink); */
    border-bottom: 1px solid #d5d5d5;
    /* background: #ffffff; */
    border-top: 1px solid #cdcdcd;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0;
}

.kick {
    /* font-size: 12.5px; */
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--teal-ink);
    /* margin-bottom: 25px; */
}

h2 {
    font-size: clamp(1.7rem,5.5vw,2.5rem);
    line-height: 1.12;
    letter-spacing: -.03em;
    font-weight: 800;
    color: #001d1b;
}

.kick + h2 {
    margin-top: 8px
}

.sub {
    margin-top: 12px;
    color: var(--mut);
    margin-bottom: 12px;
}

.sh {
    /* margin-bottom: 28px; */
}

/* services */
.svc-grid {
    display: inline-flex;
    gap: 10px;
    justify-items: stretch;
    align-items: stretch;
    justify-content: start;
    align-content: end;
    grid-auto-flow: row dense;
    width: -webkit-fill-available;
    flex-direction: column;
}

.svc-intro .btn {
    margin-top: 22px
}

.svc-list {
    border: 1px solid #dbdbdb;
    /* display: flow; */
    border-radius: 20px;
    overflow: hidden;
    /* width: -webkit-fill-available; */
    justify-content: center;
    grid-auto-flow: row dense;
    justify-items: stretch;
    align-items: center;
    align-content: center;
    flex-direction: column;
    border: 1px solid #dbdbdb;
    display: inline-grid;
    border-radius: 25px;
    overflow: hidden;
    width: 100%;
    justify-content: stretch;
    align-content: space-between;
    flex-wrap: wrap;
    grid-auto-flow: column;
    justify-items: stretch;
    align-items: stretch;
}

.svc {
    /* display: inline-grid; */
    grid-template-columns: auto auto 1fr;
    align-items: baseline;
    gap: 14px 16px;
    padding: 18px 10px;
    /* border-bottom: 1px solid var(--line); */
    transition: background-color .18s;
    justify-items: center;
    justify-content: space-between;
    align-content: center;
    grid-auto-flow: column;
}

.svc:hover {
    background: #262828;
    COLOR: #FFF;
}

.num {
    font-size: 1.5rem;
    font-weight: 800;
    letter-spacing: -.02em;
    /* color:var(--teal-ink); */
    min-width: 2.1ch;
    font-variant-numeric: tabular-nums
}

.svi {
    width: 49px;
    height: 48px;
    border-radius: 14px;
    background: #2f2f2f;
    display: grid;
    place-items: center;
    color: #ffffff;
}

.svc:hover .svi {
    background: #387f72;
}

.svi svg {
    width: 38px;
    height: 37px;
    color: #f2f2f2;
}

.svc h3 {
    font-size: 1.06rem;
    font-weight: 700;
    /* color:var(--navy); */
    line-height: 1.3;
}

.svc p {
    font-size: 14.5px;
    /* color:var(--mut); */
    line-height: 1.45;
    margin-top: 1px
}

/* doctors */
.docs {
    display: grid;
    gap: 16px
}

.doc {
    display: inline-flex;
    gap: 18px;
    background: #fff;
    /* border: 1px solid var(--line); */
    border-radius: 24px;
    padding: 24px;
    /* background: #262626; */
    border-bottom: 1px solid var(--line);
    /* color: var(--ink); */
    border: 1px solid #ececec;
    border-bottom: 1px solid #e3e3e3;
    background: linear-gradient(135deg, var(--teal-ink), #000000);
    /* border-radius: 28px; */
    align-content: center;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    text-align: -webkit-auto;
    background: linear-gradient(135deg, #34615d, #000000);
}

.doc .av {
    width: 70px;
    height: 70px;
    font-size: 25px;
    /* flex:none; */
    /* box-shadow:0 0 0 3px var(--tint); */
    background: linear-gradient(316deg, #fff0d5, #fff3df);
    color: #032b29;
    background: linear-gradient(316deg, #b3a385, #fff3df);
    color: #032b29;
}

.doc:nth-child(2) .av {
    background: #000000;
    background: linear-gradient(316deg, #b3a385, #fff3df);
    color: #032b29;
}

.doc h3 {
    font-size: 1.2rem;
    font-weight: 800;
    color: #ffffff;
    letter-spacing: -.01em;
    line-height: 1.25
}

.role {
    font-size: 14.5px;
    color: #ffdbaf;
    font-weight: 600;
    margin-top: 2px;
    color: #fcf3e5;
    /* color: #d0b99e; */
}

.meta {
    display: flex;
    gap: 8px;
    align-items: flex-start;
    font-size: 14px;
    color: #ffffff;
    margin-top: 8px;
    line-height: 1.45
}

.meta b {
    color: #e5e5e5;
    font-weight: 600
}

.mi {
    width: 18px;
    height: 18px;
    margin-top: 2px;
    color: #d8fffc;
    color: #d0b99e;
    color: #bdbdbd;
}

.doc .btn {
    margin-top: 16px
}

/* hours + map: one deep panel */
.hsec {
    padding-top: 72px;
    padding-bottom: 72px;
    background: var(--ink);
    border-bottom: 1px solid #d5d5d5;
    background: #ffffff;
    border-top: 1px solid #cdcdcd;
}

.hpanel {
    display: grid;
    background: transparent;
    /* border-radius: 28px; */
    overflow: hidden;
    /* box-shadow: 0 22px 50px -24px rgba(13,59,56,.6); */
    gap: 40px;
    align-content: center;
    grid-auto-flow: column dense;
    align-items: start;
    justify-items: stretch;
    /* display: grid; */
    /* gap: 40px; */
    justify-items: stretch;
    align-items: stretch;
}

.hcard {
    padding: 30px 22px;
    color: #fff;
    background: #060606;
    background: linear-gradient(135deg, #0b5945, #000b09f5);
    /* background-color: #632929 !important; */
    /* background: #ffffff; */
    border-color: #353535;
    /* color: #ffffff; */
    background: linear-gradient(135deg, #0b5953, #000304f5);
    border-radius: 14px;
    border-radius: 28px;
}

.hcard h2 {
    color: #efefef;
}

.hcard .kick {
    color: #c0f9e5;
}

.hrs {
    margin-top: 18px;
    display: grid;
    gap: 0px;
}

.hrs li {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 14px;
    border-radius: 2px;
    font-size: 15.5px;
    /* color: #121212; */
    border-bottom: 1px solid rgb(112 112 112 / 24%);
    border-radius: 2px;
}

.hrs .dn {
    font-weight: 600
}

.hrs .dr {
    margin-left: auto;
    font-variant-numeric: tabular-nums;
    text-align: right
}

.hrs .tg {
    display: none;
    order: 2;
    margin-left: auto;
    background: var(--action);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 3px 9px;
    border-radius: 999px
}

.hrs li.today {
    background: #ffe4ba;
    color: var(--navy);
    border-bottom-color: #414141;
    font-weight: 700;
    border-radius: 5px;
    background: linear-gradient(316deg, #fff0d5, #fff3df);
    color: #032b29;
    /* background: linear-gradient(316deg, #ffe5b9, #ffefd7); */
    /* background: linear-gradient(316deg, #ffe5b9, #ffefd7); */
    /* color: #032b29; */
}

.hrs li.today .tg {
    display: inline-block
}

.hrs li.today .dr {
    order: 3;
    margin-left: 12px;
    font-weight: 700
}

.info {
    margin-top: 20px;
    display: grid;
    gap: 6px
}

.info li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 15px;
    line-height: 1.5;
    color: #fff
}

.info .mi {
    color: #a7e6dc
}

.tel {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    margin: -8px 0;
    font-weight: 700;
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color .18s
}

.tel:hover {
    color: #bfe3dd
}

.hcard .btn {
    margin-top: 16px;
    width: 100%
}

.mapbox {
    position: relative;
    display: flex;
    flex-direction: column;
    min-height: 380px;
    background: transparent;
}

.mapview {
    position: relative;
    flex: 1;
    min-height: 320px
}

.mapfill {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    gap: 2px;
    padding: 20px;
    color: var(--ink)
}

.mfi {
    width: 34px;
    height: 34px;
    color: var(--action);
    margin-bottom: 6px
}

.mf-a {
    font-weight: 700
}

.mf-b {
    font-size: 14px;
    color: var(--mut)
}

iframe.map {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    border: 0;
    background: transparent
}

.mapbar {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 48px;
    /* background: transparent; */
    /* border-top: 1px solid var(--line); */
    /* font-weight: 700; */
    font-size: 14px;
    /* color: var(--action); */
    /* transition: background-color .18s,color .18s; */
    /* border-color: #374a48; */
    /* color: #fff; */
    /* background: linear-gradient(135deg, #134e4a, #06352cf5); */
    /* background-color: transparent; */
    /* background: linear-gradient(316deg, #ffdfab, #ffeaca); */
    background: linear-gradient(311deg, #fff2db, #ffedd1);
    /* color: #ffffff; */
    /* background: #262828; */
}

.mapbar:hover {
    background: var(--tint);
    color: var(--actionh);
    /* border-color: #374a48; */
    color: #fff;
    /* background: linear-gradient(135deg, #134e4a, #072321); */
    /* background-color: #000 !important; */
    /* background: linear-gradient(316deg, #ffdfab, #ffeaca); */
    /* background: linear-gradient(311deg, #fff2db, #ffedd1); */
    color: #032b29;
}

/* faq */
.faq-grid {
    display: inline-flex;
    gap: 12px;
    grid-auto-flow: column;
    align-content: center;
    align-items: flex-start;
    flex-direction: column;
    justify-content: center;
}

.qs {
    display: inline-grid;
    gap: 12px;
    align-content: start;
    /* width: -webkit-fill-available; */
    grid-auto-flow: dense;
    /* width: 22%; */
    justify-items: stretch;
    align-items: center;
    width: -webkit-fill-available;
}

.q {
    background: #fff;
    border: 0px solid var(--line);
    /* border-radius: 2px; */
    transition: border-color .18s;
    border-color: #374a48;
    color: #fff;
    background: linear-gradient(135deg, #1a252b, #002126);
    /* background: linear-gradient(135deg, #1a252b, #002126); */
}

.q:hover {
    border-color: #929292;
    /* background: linear-gradient(4.2304rad, #0e483b, #093b31); */
    /* color: #eefff5; */
    background: linear-gradient(117deg, #003f30, #002a24);
    /* background: linear-gradient(316deg, #fff0d5, #fff3df); */
    color: revert;
    /* border-radius: 4px; */
}

.q summary {
    list-style: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px;
    font-weight: 700;
    font-size: 1.02rem;
    /* color: var(--navy); */
    line-height: 1.35;
    min-height: 60px;
}

.q summary::-webkit-details-marker {
    display: none
}

.qi {
    width: 24px;
    height: 24px;
    color: #ffffff;
    transition: transform .2s
}

.q[open] .qi {
    transform: rotate(45deg);
    /* color: #fff; */
    background: transparent;
}

.q p {
    padding: 0 20px 20px;
    /* color: var(--mut); */
    max-width: 42em;
    color: #fff;
}

/* ready to book */
.ready {
    background: #fff
}

.ready-in {
    display: grid;
    gap: 28px;
    align-items: center
}

.bigtel {
    display: inline-flex;
    align-items: center;
    min-height: 56px;
    margin-top: 14px;
    font-size: clamp(1.7rem,6vw,2.4rem);
    font-weight: 800;
    letter-spacing: -.02em;
    /* color: #363636; */
    border-bottom: 3px solid #094539;
    transition: color .18s,border-color .18s
}

.bigtel:hover {
    color: #004a45;
    border-color: #38b9b1;
}

.rcard {
    background: #fff;
    /* border: 1px solid var(--line); */
    border-radius: 22px;
    padding: 24px;
    box-shadow: 0 18px 40px -26px rgba(13,59,56,.45);
    /* background: #000607; */
    border-color: #374a48;
    /* color: #fff; */
    background: linear-gradient(135deg, #1b6955, #06352cf5);
    /* color: #fff; */
    background: linear-gradient(135deg, #108a69, #032c21f5);
}

.rk {
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #aefbff;
    color: #c0f9e5;
}

.rv {
    margin-top: 6px;
    font-size: 1.02rem;
    font-weight: 600;
    line-height: 1.55;
    color: #fbfbfb;
}

.rv b {
    font-weight: 800
}

.rlink {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    font-weight: 700;
    font-size: 14.5px;
    color: #7bfff5;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color .18s
}

.rlink:hover {
    color: var(--actionh)
}

.rcard hr {
    border: 0;
    border-top: 1px solid #13131324;
    margin: 12px 0 18px
}

/* footer */
.ft {
    background: #022f2c;
    color: #d2e6e3;
    padding: 36px 0;
    /* background-color: #000 !important; */
}

.ft-in {
    display: grid;
    gap: 12px;
    font-size: 14.5px
}

.ft-b {
    display: flex;
    align-items: center;
    gap: 12px
}

.ft-b .logo {
    height: 40px;
    width: auto
}

.ft-e {
    /* font-weight: 700; */
    color: #fff
}

.ft a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    /* text-decoration: underline; */
    /* text-underline-offset: 3px; */
    transition: color .18s
}

.ft a:hover {
    /* text-decoration-thickness: 2px; */
    /* color: #bfe3dd; */
}

.ft-p a {
    /* font-weight: 700; */
    color: #fff;
}

.ft-c,.ft-p {
    font-size: 14px
}

@media (min-width: 640px) {
    .hero {
        padding:48px 0 70px;
    }

    .photo {
        aspect-ratio: 5/4
    }

    .trust-in {
        grid-template-columns: 2fr 2.25fr;
    }

    .docs {
        grid-template-columns: 1fr 1fr
    }

    .tk {
        grid-template-columns: 300px 1fr
    }

    .tk-l {
        grid-row: 1 / span 2
    }

    .tk-m {
        border-top: 0;
        border-left: 2px dashed #b9c7ca;
        padding: 32px 30px 8px
    }

    .tk-r {
        justify-content: flex-start;
        padding: 12px 30px 28px
    }

    .ready-in {
        grid-template-columns: 1.1fr .9fr
    }
}

@media (min-width: 960px) {
    .nav {
        display:flex
    }

    html {
        scroll-padding-top: 110px
    }

    .hero {
        padding: 38px 0 92px;
        display: inline-flex;
        justify-content: center;
        align-content: center;
        flex-wrap: wrap;
        flex-direction: column;
        width: -webkit-fill-available;
        /* align-items: center; */
        border-bottom: 1px solid #e4e4e4;
    }

    .hero-in {
        /* grid-template-columns: 1.02fr .98fr; */
        /* gap: 58px; */
        /* align-items: center; */
        /* grid-template-columns: 1.02fr .98fr; */
        /* gap: 50px; */
        /* align-items: center; */
        /* grid-template-columns: 1.02fr .98fr; */
        /* gap: 50px; */
        /* align-items: center; */
        /* grid-template-columns: 1.02fr .98fr; */
        /* gap: 52px; */
        /* align-items: center; */
        /* grid-template-columns: 1.02fr .98fr; */
        /* gap: 118px; */
        align-items: center;
        grid-template-columns: 1.02fr .98fr;
        gap: 28px;
        align-items: center;
        grid-template-columns: 1.02fr .98fr;
        /* gap: 56px; */
        align-items: center;
        grid-template-columns: 1.02fr .98fr;
        gap: 56px;
        align-items: center;
        display: inline-flex;
        align-content: flex-start;
        /* flex-wrap: wrap; */
        /* flex-direction: column; */
        grid-template-columns: 1.02fr .98fr;
        gap: 58px;
        align-items: center;
    }

    .photo {
        aspect-ratio: 4/5
    }

    .sec {
        padding:92px 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        align-content: center;
        width: -webkit-fill-available;
    }

    .band {
        padding: 76px 0 80px
    }

    .tk {
        grid-template-columns: 340px 1fr auto
    }

    .tk-l {
        grid-row: auto
    }

    .tk-m {
        padding: 36px 36px
    }

    .tk-r {
        flex-direction: column;
        justify-content: center;
        padding: 36px 40px;
        border-left: 2px dashed #b9c7ca
    }

    .svc-grid {
        grid-template-columns: auto;
        gap: initial;
        width: -webkit-fill-available;
        display: inline-flex;
        align-items: flex-start;
        justify-content: flex-start;
        align-content: flex-start;
        flex-wrap: wrap;
        flex-direction: column;
    }

    .svc-intro {
        /* position: sticky; */
        top: 150px;
        align-self: start;
    }

    .svc {
        padding: 22px 14px;
        gap: 27px 22px;
        background: #f7ecd9;
        /* display: inline-flex; */
        grid-auto-flow: column;
        text-align: -webkit-auto;
        align-items: end;
        /* background: #f7ecd9; */
        /* border-bottom: 1px solid var(--line); */
        color: var(--ink);
        /* color: #fff; */
        justify-content: start;
        align-content: center;
        justify-items: center;
        /* width: -webkit-fill-available; */
        flex-wrap: nowrap;
        flex-direction: column;
        padding: 22px 14px;
        gap: 27px 22px;
        background: #f7ecd9;
        /* border-bottom: 1px solid var(--line); */
        color: var(--ink);
        display: inline-flex;
        grid-auto-flow: dense;
        justify-items: end;
        flex-wrap: wrap;
        text-align: -webkit-auto;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        align-content: flex-start;
    }

    .hpanel {
        grid-template-columns: .92fr 1.08fr;
    }

    .hcard {
        /* padding: 44px 40px; */
    }

    .mapbox {
        min-height: 560px;
    }

    .faq-grid {
        grid-template-columns: 481px 1fr;
        /* gap: 64px; */
    }

    .sh {
        /* margin-bottom: 36px; */
    }

    .faq-grid .sh {
        margin: 0
    }

    .ft-in {
        grid-template-columns: auto 1fr auto;
        align-items: center;
        gap: 4px 32px
    }

    .ft-e {
        justify-self: center
    }

    .ft-l {
        justify-self: end
    }

    .ft-c {
        grid-column: 1 / span 2
    }

    .ft-p {
        justify-self: end
    }
}


.split-grid {display: grid;gap: 84px;justify-items: stretch;align-items: stretch;grid-auto-flow: column;align-content: center;grid-template-columns: 1fr 1fr;/* display: grid; */gap: 20px;}

@media (max-width: 640px) {
    .wrap {
        /* padding:0 16px; */
        display: inline-flex;
        flex-direction: column;
        flex-wrap: nowrap;
        align-content: center;
        justify-content: center;
        align-items: center;
        width: -webkit-fill-available;
        column-gap: 0px;
        row-gap: 39px;
    }

    .hd {
        position: static
    }

    html {
        scroll-padding-top: 16px
    }

    .hd-in {
        /* display: grid; */
        /* grid-template-columns: 1fr auto; */
        grid-template-areas:
            "brand book"
            "lang login";
        min-height: 0;
        gap: 6px 10px;
        padding-top: 10px;
        padding-bottom: 10px;
    }

    .hd-acts {
        /* display: unset; */
        /* flex-direction: column; */
        /* flex-wrap: wrap; */
        /* align-content: center; */
        /* justify-content: flex-start; */
        /* align-items: center; */
    }

    .bl {
        grid-area: brand;
        margin-right: 0;
        display: inline-flex;
        align-content: center;
        align-items: center;
        justify-content: space-between;
        width: -webkit-fill-available;
    }

    .bl-who b {
        font-size: 15px
    }

    .hd-acts .btn-sm {
        grid-area: book;
        padding: 0 14px
    }

    .lang {
        grid-area: lang;
        justify-self: start
    }

    .lang-sel {
        font-size: 16px;
        padding: 0 30px 0 12px;
        background-position: right 9px center,0 0
    }

    .login {
        display: inline-flex;
        grid-area: login;
        justify-self: end;
        border: 1px solid var(--line);
        border-radius: 7px;
        padding: 0 16px;
        background: #fff
    }

    .lf {
        display: none
    }

    .ls {
        display: inline
    }

    .hero {
        padding-top: 22px;
        padding-bottom: 100px;
    }

    .cta .btn-lg {
        flex: 1 1 100%;
        /* width: auto; */
    }

    .trio {
        grid-template-columns: 1fr;
        display: inline-flex;
        align-items: start;
        justify-content: space-around;
        align-content: space-between;
        grid-template-columns: repeat(2, 1fr);
        gap: 5px;
        /* justify-items: end; */
        grid-auto-flow: column dense;
        width: -webkit-fill-available;
    }

    .trio li {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 11px 0;
        margin: 0;
        border-right: 0;
        border-bottom: 1px solid #e7e7e782;
        background: transparent;
    }

    .trio .hv {
        margin: 0;
        font-size: 14px;
        text-align: right
    }

    .chip-s {
        left: 10px;
        bottom: 10px
    }

    .chip-d {
        right: 10px;
        top: 10px
    }

    .tr2 .btn {
        /* margin-left: 64px; */
    }

    .svc {
        /* gap: 12px; */
        /* padding: 16px 4px; */
        width: -webkit-fill-available;
        width: auto;
        width: -webkit-fill-available;
        display: grid;
        align-items: baseline;
        width: -webkit-fill-available;
        flex-wrap: nowrap;
        grid-auto-flow: row dense;
        justify-items: start;
        justify-content: center;
        align-content: space-between;
        /* text-align: center; */
    }

    .num {
        font-size: 1.2rem
    }

    .svi {
        width: 42px;
        height: 42px
    }

    .hcard {
        padding: 26px 14px
    }

    .doc {
        padding: 20px
    }

    .tk-l,.tk-m {
        padding-left: 20px;
        padding-right: 20px
    }
}

@media (prefers-reduced-motion:reduce) {
    * {
        transition: none!important;
        scroll-behavior: auto!important;
    }
}

html[lang="pa"] body {
    font-size: 17px;
    line-height: 1.7
}

html[lang="pa"] h1 {
    line-height: 1.22;
    letter-spacing: -.01em
}

html[lang="pa"] h2 {
    line-height: 1.28;
    letter-spacing: -.01em
}

html[lang="pa"] .btn,html[lang="pa"] .nav,html[lang="pa"] .trio .hv {
    font-size: 15px
}

html[lang="pa"] .kick,html[lang="pa"] .trio .hl,html[lang="pa"] .tk-lab,html[lang="pa"] .tk-kicker,html[lang="pa"] .rk {
    letter-spacing: .02em;
    text-transform: none;
    font-size: 14px
}

html[lang="pa"] .tk-ok {
    text-transform: none;
    letter-spacing: 0
}

/* cta1028: Ab's side-by-side ticket card (Commander's grid). Phones: 150px | 1fr, left panel spans 2 rows, check panel under the middle. >=48rem: 349px 1fr auto. Blue/navy/silver only. */
.tk {
    --tk-dark: #0b2545;
    --tk-label: #bfdbfe;
    --tk-link: #bfdbfe;
    --tk-btn: #1d4ed8;
    --tk-btn-hover: #1e3a8a;
    --tk-dash: #1d4ed8;
    --tk-check: #1d4ed8;
    --tk-ink: #0b2545;
    --tk-sub: #334155;
    --tk-line: #cbd5e1;
    display: grid;
    grid-template-columns: 150px 1fr;
    grid-template-rows: auto auto;
    align-items: stretch;
    width: 100%;
    /* background: transparent; */
    border-color: #cbd5e1;
    border-radius: 25px;
    overflow: hidden;
    color: #0b2545;
    text-align: left
}

.tk>.tk-l {
    grid-column: 1;
    grid-row: 1 / span 2
}

.tk>.tk-m {
    grid-column: 2;
    grid-row: 1
}

.tk>.tk-r {
    grid-column: 2;
    grid-row: 2
}

.tk>.tk-l,.tk>.tk-m,.tk>.tk-r {
    align-self: stretch
}

/* cta1028b */
.tk .tk-l {
    /* background: #0b453d; */
    color: #fff;
    padding: 22px 14px 18px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    align-self: stretch;
    min-width: 0;
    color: #fff;
    background: linear-gradient(135deg, #d4fff3, #fffffff5);
    background: #0f634c;
    background: linear-gradient(135deg, #2e433e, #000000f5);
    background: linear-gradient(135deg, #004c57, #000000f5);
}

.tk .tk-brand {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px
}

.tk .tk-brand img,.tk .tk-brand .mark {
    width: 40px;
    height: 40px;
    flex: none
}

.tk .tk-name {
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
    letter-spacing: -.01em;
    white-space: normal;
    overflow-wrap: anywhere;
    color: #fff
}

.tk .tk-l .logo {
    height: auto;
    width: 100%;
    max-width: 122px
}

.tk .tk-lab {
    margin-top: 16px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #bfdbfe;
    color: #b2fffa;
}

.tk .tk-doc {
    margin-top: 3px;
    font-size: 14.5px;
    line-height: 1.3;
    font-weight: 700;
    color: #fff
}

.tk .tk-l .tk-addr {
    margin-top: 4px;
    font-size: 14px;
    line-height: 1.4;
    color: #e2e8f0;
    overflow-wrap: anywhere
}

.tk .tk-l .tk-a {
    display: inline-block;
    min-height: 0;
    margin-top: 12px;
    font-size: 14.5px;
    font-weight: 700;
    color: #d5fffc;
    text-decoration: revert-layer;
    text-underline-offset: 4px;
}

.tk .tk-l .tk-a:hover {
    color: #128b6c;
    /* text-decoration-thickness: 2.5px; */
    color: #b2fffa;
}

.tk .tk-l .tk-map {
    display: flex;
    align-items: center;
    justify-content: center;
    align-self: stretch;
    width: auto;
    height: auto;
    min-height: 44px;
    margin-top: 14px;
    padding: 8px 10px;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    white-space: normal;
    border-radius: 6px;
    background: #1d4ed8;
    border: 0px solid #15211e;
    color: #00625c;
    background: linear-gradient(135deg, #ffffff, #fffffff5);
    background: linear-gradient(135deg, #128b6c, #0b6250f5);
    color: #eefff5;
}

.tk .tk-l .tk-map:hover {
    background: #1e3a8a;
    color: #fff;
    background: linear-gradient(135deg, #128b6c, #0b6250f5);
    color: #eefff5;
}

.tk .tk-m {
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 20px 14px 12px;
    border: 0;
    border-left: 2px dashed #cbd5e1;
    background: #fff;
    border-left: 0px dashed #cbd5e1;
    /* background: #efefef; */
    /* background: #f7ecd9; */
    border-bottom: 0px solid var(--line);
    color: var(--ink);
}

.tk .tk-kicker {
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--actionh);
}

.tk .tk-when {
    margin: 4px 0 0;
    max-width: none;
    font-size: clamp(19px,5.2vw,22px);
    font-weight: 800;
    line-height: 1.2;
    color: #0b2545
}

.tk .tk-addr2,.tk .tk-m .tk-addr {
    margin: 12px 0 0;
    font-size: 14px;
    line-height: 1.4;
    color: #334155
}

.tk .tk-hr {
    margin: 8px 0 0;
    font-size: 14px;
    line-height: 1.5;
    color: #334155
}

.tk .tk-hr b {
    color: #0b2545
}

.tk .tk-a2,.tk .tk-m .tk-a {
    display: inline-block;
    margin: 6px 0 0;
    font-size: 14.5px;
    font-weight: 700;
    color: var(--actionh);
    text-decoration: underline;
    text-underline-offset: 3px
}

.tk .tk-a2:hover,.tk .tk-m .tk-a:hover {
    color: #128b6c;
    text-decoration: underline
}

.tk .tk-btns {
    display: flex;
    flex-direction: column;
    flex-wrap: nowrap;
    gap: 10px;
    width: 100%;
    max-width: none;
    margin: 16px 0 0
}

.tk .tk-btns a,.tk .tk-btns .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    flex: none;
    width: 100%;
    max-width: none;
    height: auto;
    min-height: 46px;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    text-decoration: none;
    white-space: normal;
    border: 0px solid #1d4ed8;
    transition: background-color .15s,border-color .15s,color .15s;
}

.tk .tk-btns a:first-child {
    /* background: #1d4ed8; */
    color: #fff;
    /* border-color: #1d4ed8; */
    background: linear-gradient(135deg, #108a69, #032c21f5);
}

.tk .tk-btns a:first-child:hover {
    background: #1e3a8a;
    /* border-color: #1e3a8a; */
    color: #fff;
    background: linear-gradient(135deg, #128b6c, #0b6250f5);
    color: #eefff5;
}

.tk .tk-btns a:last-child {
    background: #fff;
    /* color: #1d4ed8; */
    /* border-color: #1d4ed8; */
    background: linear-gradient(316deg, #ffdfab, #ffeaca);
    border: 1px solid #ffdea9;
    color: var(--ink);
    border: 1px solid #d2d2d2;
    border-radius: 6px;
    border-bottom: 1px solid #d2d2d2;
    background: linear-gradient(332deg, #f7ecd9, #fff8ed);
    /* background: #454545; */
    /* border-color: #353535; */
    /* color: #ffffff; */
}

.tk .tk-btns a:last-child:hover {
    /* background: #dbeafe; */
    /* color: #1e3a8a; */
    /* border-color: #1e3a8a; */
    background: #454545;
    border-color: #353535;
    color: #ffffff;
    background: #454545;
    border-color: #353535;
    color: #ffffff;
    background: #454545;
    border-color: #353535;
    color: #ffffff;
}

.tk .tk-r {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 10px;
    min-width: 0;
    padding: 2px 12px 14px;
    border: 0;
    /* border-left: 2px dashed #cbd5e1; */
    background: #fff;
    /* background: #f7ecd9; */
    border-bottom: 1px solid var(--line);
    color: var(--ink);
}

.tk .tk-check {
    flex: none;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: linear-gradient(135deg,#3b82f6,#1e3a8a);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    color: #fff;
    background: linear-gradient(135deg, #108a69, #032c21f5);
}

/* design-1028 R8a: the stack's round check, no ring */
.tk .tk-check svg {
    width: 22px;
    height: 22px;
    display: block
}

.tk .tk-ok {
    margin: 0;
    max-width: none;
    font-size: 13px;
    font-weight: 800;
    letter-spacing: .05em;
    line-height: 1.25;
    text-transform: uppercase;
    text-align: center;
    color: #0b2545
}

@media (min-width: 48rem) {
    .tk {
        grid-template-columns:349px 1fr auto;
        grid-template-rows: auto
    }

    .tk>.tk-l {
        grid-column: 1;
        grid-row: 1
    }

    .tk>.tk-m {
        grid-column: 2;
        grid-row: 1
    }

    .tk>.tk-r {
        grid-column: 3;
        grid-row: 1
    }

    .tk .tk-l {
        padding: 28px 26px 26px
    }

    .tk .tk-brand {
        flex-direction: row;
        align-items: center;
        gap: 12px
    }

    .tk .tk-brand img,.tk .tk-brand .mark {
        width: 48px;
        height: 48px
    }

    .tk .tk-name {
        font-size: 1.35rem
    }

    .tk .tk-l .logo {
        max-width: 100%;
        height: 40px;
        width: auto
    }

    .tk .tk-lab {
        margin-top: 22px;
        font-size: 12px
    }

    .tk .tk-doc {
        font-size: 1.12rem
    }

    .tk .tk-l .tk-addr {
        font-size: 15px
    }

    .tk .tk-l .tk-a {
        margin-bottom: 18px
    }

    .tk .tk-l .tk-map {
        align-self: flex-start;
        margin-top: auto;
        padding: 0 22px;
        min-height: 48px;
        font-size: 15px
    }

    .tk .tk-m {
        padding: 30px 30px 28px
    }

    .tk .tk-kicker {
        font-size: 12px
    }

    .tk .tk-when {
        max-width: 20ch;
        font-size: clamp(22px,2.4vw,30px)
    }

    .tk .tk-addr2,.tk .tk-m .tk-addr {
        font-size: 15px
    }

    .tk .tk-hr {
        font-size: 15px
    }

    .tk .tk-btns {
        flex-direction: row;
        flex-wrap: wrap;
        margin-top: 20px;
        max-width: 420px
    }

    .tk .tk-btns a,.tk .tk-btns .btn {
        flex: 1 1 170px;
        width: auto;
        min-height: 48px
    }

    .tk .tk-r {
        flex-direction: column;
        gap: 12px;
        padding: 0 28px;
        /* background: #ffffff; */
        /* background: #efefef; */
    }

    .tk .tk-check {
        width: 64px;
        height: 64px
    }

    .tk .tk-check svg {
        width: 32px;
        height: 32px
    }

    .tk .tk-ok {
        max-width: 11ch;
        font-size: 14px
    }
}

/* Change the solid green to an outline */
.hd-acts .login {
    /* background-color: transparent !important; */
    /* color: #0f4c3a !important; */
    /* border: 1.5px solid #0f4c3a !important; */
    /* border-radius: 8px; */
    /* padding: 8px 18px; */
    /* font-weight: 600; */
    /* transition: all 0.2s ease; */
    /* background: linear-gradient(135deg, #128b6c, #0b6250f5); */
    /* color: #eefff5; */
    /* background: linear-gradient(135deg, #128b6c, #0b6250f5); */
    /* color: #eefff5; */
    background: linear-gradient(176deg, #026e6e, #004638f5);
    background-image: linear-gradient(176deg, rgb(2, 110, 110), rgba(0, 70, 56, 0.96));
}

.hd-acts .login:hover {
    /* background-color: #0f4c3a !important; */
    /* color: #ffffff !important; */
    background: linear-gradient(135deg, #128b6c, #0b6250f5);
    color: #eefff5;
}

.lang-trig:hover svg {
    color: wheat;
}

.lang.open .lang-trig {
    border-radius: 6px 6px 0 0;
    /* box-shadow: 0px 0px 0px 1px rgb(0 0 0); */
    z-index: 60;
    position: relative;
    width: auto;
}

.lang-sel:hover,
.lang-trig:hover {
    color: #fff;
    background-color: #000 !important;
    background: linear-gradient(176deg, #167474, #064f40f5);
    border-color: #065d52;
    box-shadow: -1px 1px 1px 0px rgba(0, 0, 0, 0.08);
}

.lang.open .lang-trig:hover {
    /* box-shadow: inset 0 0 1px 1px rgb(0 0 0); */
}
.glass{max-width: 441px;/* padding: 41px 38px 14px; */border-radius: 25px;background:rgba(255,255,255,.80);backdrop-filter:blur(22px) saturate(1.3);-webkit-backdrop-filter:blur(22px) saturate(1.3);border:1px solid rgba(255,255,255,.85);box-shadow:0 30px 70px -24px rgba(19,78,74,.45);/* width: auto; *//* padding: 35px 27px 41px; *//* padding: 35px 27px 41px; */border-radius: 32px;background: rgba(255, 255, 255, .80);backdrop-filter: blur(22px) saturate(1.3);-webkit-backdrop-filter: blur(22px) saturate(1.3);border: 1px solid rgba(255, 255, 255, .85);box-shadow: 0 30px 70px -24px rgba(19, 78, 74, .45);padding: 28px 19px 29px;border-radius: 32px;background: rgba(255, 255, 255, .80);backdrop-filter: blur(22px) saturate(1.3);-webkit-backdrop-filter: blur(22px) saturate(1.3);border: 1px solid rgba(255, 255, 255, .85);box-shadow: 0 30px 70px -24px rgba(19, 78, 74, .45);max-width: min-content;max-width: fit-content;}


    
    .faq-container {display: inline-flex;flex-direction: column;gap: 12px;/* height: -webkit-fill-available; */width: -webkit-fill-available;align-content: center;flex-wrap: nowrap;align-items: stretch;}
    .q {/* background: #fff; *//* border: 0px solid #d3d3d3; */border-radius: 12px;/* border-radius: 28px; */}
    .q summary {list-style: none;cursor: pointer;display: flex;align-items: center;justify-content: space-between;padding: 18px 20px;font-weight: 700;font-size: 1.02rem;/* color: #b7eddf; *//* background: linear-gradient(135deg, #1a252b, #002126); */color: #fff;}
    .q summary::-webkit-details-marker { display: none }
    .qi {width: 24px;height: 24px;color: #179370;/* transition: transform .2s; *//* color: #fbf2e3; */background: transparent;color: #78a592;}
    .q[open] .qi { transform: rotate(45deg) }
    .q p {padding: 0 20px 20px;/* color: var(--mut); */}

    .ready-box {background: var(--band2);/* border: 1px solid var(--line); */border-radius: 22px;padding: 32px;/* box;box-shadow: 0 18px 40px -26px rgba(13, 59, 56, .15);;kground: linear-gradient(135deg, #1b6955, #06352cf5); */color: #fff;/* background: linear-gradient(135deg, #108a69, #032c21f5); *//* background: linear-gradient(135deg, #1a252b, #002126); *//* background: linear-gradient(135deg, #1a252b, #002126); */}
    .bigtel {display: inline-flex;align-items: center;min-height: 56px;margin-top: 14px;font-size: clamp(1.7rem, 6vw, 2.4rem);font-weight: 800;color: #006f67;border-bottom: 3px solid #00beb0;/* text-decoration: none; */margin-bottom: 33px;}

@media (min-width: 960px) {
    .split-grid {
        grid-template-columns: 1fr 1fr;
    }
}

.tk-sec {
    margin-top: -40px;
    position: relative;
    z-index: 2;
    /* margin-top: -80px; */
    /* background: #087870; */
    /* background: linear-gradient(135deg, #1a252b, #002126); */
}


.eyebrow::before {
    content: "";
    width: 18px;
    height: 4px;
    border-radius: 0px;
    background: #4ba4e3;
}


.eyebrow::before {width: 26px;height: 26px;border-radius: 0;background: #187d78;-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.4-4.5-9.5-9.3C1 8.2 3.1 4.6 6.7 4.6c2 0 3.4 1.1 4.3 2.5h2c.9-1.4 2.3-2.5 4.3-2.5 3.6 0 5.7 3.6 4.2 7.1C19.4 16.5 12 21 12 21z'/%3E%3C/svg%3E") center / contain no-repeat;mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.4-4.5-9.5-9.3C1 8.2 3.1 4.6 6.7 4.6c2 0 3.4 1.1 4.3 2.5h2c.9-1.4 2.3-2.5 4.3-2.5 3.6 0 5.7 3.6 4.2 7.1C19.4 16.5 12 21 12 21z'/%3E%3C/svg%3E") center / contain no-repeat;margin-top: -3px;background: linear-gradient(135deg, #00c9ad, #2c5e48f5);/* background: linear-gradient(135deg, #108a69, #032c21f5); */}
/* opening hours card: the address under the hours */


.eyebrow {
    display: flex;
    gap: 4px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #454545;
    margin-bottom: 22px;
    justify-content: flex-start;
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    margin-bottom: 22px;
}

a.btn.btn-lg.btn-p.white-btn {
    /* box-shadow: 0 14px 34px -10px rgba(13, 59, 56, .4); */
    /* font-size: 13.5px; */
    /* line-height: 1.3; */
    background: #fff;
    border: 1px solid #d6d6d6;
    color: var(--navy);
}


.q:hover .qi {
    border-color: #929292;
    /* background: linear-gradient(4.2304rad, #0e483b, #093b31); */
    /* color: #eefff5; */
    background: linear-gradient(117deg, #003f30, #002a24);
    /* background: linear-gradient(316deg, #fff0d5, #fff3df); */
    color: revert;
    border-radius: 4px;
    background: transparent;
}

@media (max-width: 720px) {
    .tk-sec {
        margin-top: -27px;
    }
}

/* ===== 2026-11-01 Opus: Commander's Derry asks (appended last) ===== */
.chip-k { display: block; font-size: 11px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--teal-ink); line-height: 1.2; margin-bottom: 2px; }
.doc-new { display: inline-flex; align-items: center; gap: 8px; margin-top: 12px; padding: 5px 12px 5px 5px; border-radius: 4px; border-left: 3px solid var(--teal-lt); background: rgba(255,255,255,.08); color: #e4fffd; font-size: 13.5px; font-weight: 700; line-height: 1.2; }
.doc-new-ic { flex: none; display: grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: linear-gradient(135deg, #14b8a6, #0f766e); color: #fff; }
.doc-new-ic svg { display: block; width: 14px; height: 14px; max-width: none; }

/* 2026-11-01 Opus: "How booking works" = 3 steps in one rounded table like Services (Commander) */
.trust-in.steps3 { display: grid; grid-template-columns: 1fr; gap: 0; width: calc(100% - 48px); max-width: 1152px; padding: 0; border: 1px solid #dbdbdb; border-radius: 25px; overflow: hidden; background: #fff; box-shadow: 0 22px 50px -20px rgb(213 213 213); }
.steps3 .tr.st { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: 14px; width: auto; padding: 26px 24px; border: 0; border-bottom: 1px solid #e7e7e7; border-radius: 0; box-shadow: none; overflow: visible; }
.steps3 .tr.st:last-child { border-bottom: 0; }
.st-ics { display: flex; align-items: center; gap: 12px; }
.st-n { flex: none; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(135deg, #14b8a6, #0f766e); color: #fff; font-size: 15px; font-weight: 800; line-height: 1; }
.steps3 .st-b h2 { font-size: 1.05rem; }
.steps3 .tr.st .btn { margin-top: auto; margin-left: 0; width: 100%; }
@media (min-width: 900px) {
    .trust-in.steps3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .steps3 .tr.st { border-bottom: 0; border-right: 1px solid #e7e7e7; }
    .steps3 .tr.st:last-child { border-right: 0; }
}