/* ---------- photo slots ----------
   Replace each .ph with an <img> at the same aspect ratio.
   data-shot describes the photograph that belongs there. */
.ph{position:relative;overflow:hidden;
/*background:linear-gradient(140deg,#FCE6DA 0%,#F6E7F1 45%,#E4ECFB 100%);*/
display:grid;place-items:center}
.ph::before{content:"";position:absolute;width:150%;height:150%;
/*background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.7),transparent 42%),radial-gradient(circle at 78% 76%,rgba(255,255,255,.5),transparent 40%)*/
    
}
.ph svg{position:relative;color:rgba(22,32,60,.28)}
.ph[data-shot]:not([data-shot=""])::after{content:attr(data-shot);position:absolute;left:12px;bottom:12px;z-index:2;background:rgba(255,255,255,.88);color:#4A5372;font-size:10.5px;font-weight:600;padding:4px 9px;border-radius:99px}
.ph-cool{background:linear-gradient(140deg,#E2EBFB 0%,#EDE7F7 50%,#FBE7DC 100%)}
.centr-banner {background-image: url(https://webs.hashtagit.in/pacificonehealth/image/2113.jpg);
    background-position: center;
  background-repeat: no-repeat;
  background-size: cover; 
}

.specialty-banner {
    background-image: url(https://webs.hashtagit.in/pacificonehealth/image/2113.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

/* ---------- header ---------- */
header.site{position:sticky;top:0;z-index:70;background:var(--paper);border-bottom:1px solid var(--line-cool)}
header.site .wrap{display:flex;align-items:center;gap:26px;min-height:80px}
.logo{display:flex;align-items:center;gap:11px;flex:none}
.logo svg{width:38px;height:38px;flex:none}
.logo b{font-family:var(--serif);font-size:22.5px;font-weight:600;letter-spacing:-.02em;display:block;line-height:1.05}
.logo span{font-size:11px;color:var(--muted);font-weight:500;letter-spacing:.04em}
nav.main{display:flex;gap:2px;margin-left:auto}
nav.main a{padding:10px 13px;border-radius:10px;font-size:15px;font-weight:500;color:var(--muted)}
nav.main a:hover{background:var(--sky);color:var(--ink)}
nav.main a[aria-current="page"]{background:var(--sky);color:var(--ink)}
.head-actions{display:flex;align-items:center;gap:10px;flex:none}
.burger{display:none;border:1px solid var(--line-cool);background:none;border-radius:10px;padding:10px 12px;cursor:pointer}

/* ---------- page banner ---------- */
.banner{position:relative;display:flex;align-items:flex-end;overflow:hidden;min-height:430px}
.banner.tall{min-height:520px}
.banner .ph{position:absolute;inset:0}
.banner .ph::after{bottom:auto;top:16px;left:16px}
.banner .veil{position:absolute;inset:0;z-index:2;
/*background:linear-gradient(180deg,rgba(21,26,56,.62) 0%,rgba(21,26,56,.3) 36%,rgba(21,26,56,.9) 100%)*/
    
}
.banner .wrap{position:relative;z-index:3;padding-block:40px 50px;color:#fff}
.banner h1{font-size:clamp(34px,4.6vw,58px);color:#fff;margin-top:16px;letter-spacing:-.024em;max-width:50ch}
.banner .lede{margin-top:16px;font-size:17.5px;color:rgba(255,255,255,.86);max-width:52ch}
.banner .cta{display:flex;gap:12px;margin-top:28px;flex-wrap:wrap;margin-bottom:45px;}
.banner .pill{display:inline-flex;align-items:center;gap:9px;background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.34);color:#fff;font-size:13.5px;font-weight:600;padding:7px 15px;border-radius:99px;backdrop-filter:blur(6px)}
.banner .pill i{width:7px;height:7px;border-radius:50%;background:#FF7517;flex:none;font-style:normal}

/* light banner variant, for listing pages */
.hero-light{
        background-image: url(https://webs.hashtagit.in/pacificonehealth/image/2117.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    /*background:var(--blush);*/
    padding-block:44px 56px;border-bottom:1px solid var(--line)}
.hero-light h1{font-size:clamp(34px,4.4vw,54px);margin-top:14px;letter-spacing:-.024em;max-width:18ch}
.hero-light .lede{margin-top:16px;font-size:18px;color:var(--muted);max-width:56ch}

/* ---------- breadcrumb ---------- */
.crumb{display:flex;gap:9px;align-items:center;flex-wrap:wrap;font-size:13.5px}
.crumb svg{opacity:.6}
.banner .crumb{color:rgba(255,255,255,.78);margin-bottom:22px}
.banner .crumb a:hover{color:#fff}
.banner .crumb [aria-current]{color:#fff;font-weight:600}
.hero-light .crumb{color:var(--muted)}
.hero-light .crumb a:hover{color:var(--indigo)}
.hero-light .crumb [aria-current]{color:var(--ink);font-weight:600}

/* ---------- stat rail ---------- */
.rail{margin-top:-44px;position:relative;z-index:20;margin-bottom:70px;}
.rail-inner{background:var(--paper);border-radius:var(--r-lg);box-shadow:var(--shadow-l);display:grid;grid-template-columns:repeat(4,1fr);overflow:hidden}
.rail-inner.five{grid-template-columns:repeat(5,1fr)}
.rail-inner div{padding:24px 26px;border-right:1px solid var(--line-cool)}
.rail-inner div:last-child{border-right:0}
.rail-inner b{font-family:var(--serif);font-size:30px;font-weight:600;display:block;line-height:1.1}
.rail-inner span{font-size:13.5px;color:var(--muted)}

/* ---------- sticky sub nav ---------- */
.subnav{position:sticky;top:80px;z-index:60;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-cool)}
.subnav .wrap{
    /*display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;align-items:center*/
    display: flex;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
    align-items: center;
    justify-content: center;
    margin-left: auto;
    margin-right: auto;
}
.subnav .wrap::-webkit-scrollbar{display:none}
.subnav a{padding:17px 14px;font-size:14.8px;font-weight:500;color:#18214E;white-space:nowrap;border-bottom:2px solid transparent}
.subnav a:hover{color:#FF7517;}
.subnav a.active{color:var(--coral-text);border-bottom-color:var(--coral);font-weight:600}
.subnav .book{margin-left:auto;padding-block:9px;border-bottom:0}

/* ---------- section heads ---------- */
.kicker{display:inline-block;font-size:13px;font-weight:700;color:var(--coral-text);margin-bottom:12px}
.sec-head{max-width:640px;margin-bottom:44px}
.sec-head.row{max-width:none;display:flex;justify-content:space-between;align-items:flex-end;gap:44px}
.sec-head h2{font-size:clamp(28px,3.3vw,41px)}
.sec-head p{color:var(--muted);margin-top:14px;font-size:16.5px}
.more{font-weight:600;color:var(--indigo);white-space:nowrap}
.more:hover{color:var(--coral-text)}

/* ---------- prose + side ---------- */
.two-col{display:grid;grid-template-columns:1.35fr .65fr;gap:56px;align-items:start}
.prose p{color:var(--muted);margin-bottom:18px;font-size:16.8px}
.prose p:last-child{margin-bottom:0}
.prose strong{color:var(--ink)}
.pull{border-left:3px solid var(--coral);padding:4px 0 4px 22px;margin:26px 0;font-family:var(--serif);font-size:20px;line-height:1.45;color:var(--ink)}
.side-box{border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;background:var(--sand)}
.side-box.cool{background:var(--sky);border-color:var(--line-cool)}
.side-box h3{font-size:19px;margin-bottom:16px}
.side-box li{display:flex;gap:11px;padding:11px 0;border-bottom:1px solid var(--line);font-size:15px;align-items:flex-start}
.side-box li:last-child{border-bottom:0}
.side-box svg{flex:none;margin-top:4px;color:var(--sage)}
.side-box .btn{margin-top:18px}

/* ---------- chip lists (conditions, expertise) ---------- */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips span,.chips a{display:inline-flex;align-items:center;gap:9px;background:var(--paper);border:1px solid var(--line);border-radius:99px;padding:6px 18px;font-size:14.8px;font-weight:500}
.chips a:hover{border-color:var(--coral);color:var(--coral-text)}
.chips .dot{width:6px;height:6px;border-radius:50%;background:var(--coral);flex:none}
.chips .hidden{display:none}
.expand{margin-top:28px;text-align:center}
span.dot {
    padding: 4px;
}
/* ---------- generic card grids ---------- */
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:10px}
.card .ic{width:48px;height:48px;border-radius:14px;background:var(--sky);color:var(--indigo);display:grid;place-items:center;margin-bottom:6px}
.card:nth-child(3n+2) .ic{background:var(--coral-soft);color:var(--coral-text)}
.card:nth-child(3n) .ic{background:var(--sage-soft);color:var(--sage)}
.card h3{font-size:20px}
.card p{font-size:14.8px;color:var(--muted);line-height:1.55}
.card .meta{margin-top:auto;padding-top:0px;font-size:13.5px;font-weight:600;color:var(--sage)}
.card-media{padding:0;overflow:hidden}
.card-media .ph{aspect-ratio:16/9}
.card-media .body{padding:24px;display:flex;flex-direction:column;gap:9px;flex:1}

/* ---------- doctor cards ---------- */
.filters{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:30px}
.filters button{padding:9px 17px;border-radius:99px;border:1px solid var(--line-cool);background:var(--paper);font-size:14.5px;font-weight:500;cursor:pointer;transition:all .14s ease}
.filters button:hover{border-color:var(--muted)}
.filters button[aria-pressed="true"]{background:var(--indigo);border-color:var(--indigo);color:#fff}
.doctors{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.doctors.cols-3{grid-template-columns:repeat(3,1fr)}
.doc{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .2s ease}
.doc:hover{box-shadow:var(--shadow-l)}
.doc .ph{aspect-ratio:1/1}
.doc .body{padding:20px;display:flex;flex-direction:column;flex:1}
.doc h3{font-size:17.5px;line-height:1.3}
.doc .honour{display:inline-block;font-size:11px;font-weight:700;color:var(--coral-text);background:var(--coral-soft);padding:2px 8px;border-radius:99px;margin-left:5px;vertical-align:middle}
.doc .role{font-size:13.5px;color:var(--muted);margin-top:7px;line-height:1.45}
.doc .line{margin-top:12px;font-size:13.5px;color:var(--muted);display:flex;gap:8px;align-items:flex-start}
.doc .line svg{flex:none;margin-top:3px;color:var(--sage)}
.doc .btn{margin-top:16px;width:100%}
.no-match{grid-column:1/-1;border:1px dashed var(--line-cool);border-radius:var(--r-lg);padding:46px;text-align:center;color:var(--muted)}
.no-match strong{display:block;font-family:var(--serif);font-size:21px;color:var(--ink);margin-bottom:8px}

/* ---------- doctor profile header ---------- */
.profile{display:grid;grid-template-columns:330px 1fr;gap:48px;align-items:start;padding-block:48px}
.profile .portrait{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line)}
.profile .portrait .ph{aspect-ratio:4/5}
.profile h1{font-size:clamp(31px,3.7vw,45px);margin-top:14px;letter-spacing:-.02em}
.profile .honour{display:inline-block;font-size:12px;font-weight:700;color:var(--coral-text);background:var(--coral-soft);padding:3px 11px;border-radius:99px;margin-left:8px;vertical-align:middle}
.profile .role{font-size:18px;color:var(--muted);margin-top:12px;max-width:46ch}
.profile .quals{margin-top:14px;font-size:15px;color:var(--ink);font-weight:600}
.profile .facts{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:30px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.profile .facts div{padding:18px 22px 18px 0;border-right:1px solid var(--line);text-align: center;}
.profile .facts div:last-child{border-right:0}
.profile .facts b{font-family:var(--serif);font-size:24px;font-weight:600;display:block;line-height:1.15}
.profile .facts span{font-size:13px;color:var(--muted)}
.profile .cta{display:flex;gap:12px;margin-top:26px;flex-wrap:wrap}

/* sticky booking card */
.book-card{position:sticky;top:110px;border:1px solid var(--line-cool);border-radius:var(--r-lg);background:var(--paper);box-shadow:var(--shadow-l);padding:26px}
.book-card h3{font-size:19px;margin-bottom:6px}
.book-card > p{font-size:14px;color:var(--muted)}
.book-card .fee{display:flex;align-items:baseline;gap:9px;margin:18px 0;padding-bottom:18px;border-bottom:1px solid var(--line-cool)}
.book-card .fee b{font-family:var(--serif);font-size:30px;font-weight:600}
.book-card .fee span{font-size:13.5px;color:var(--muted)}
.book-card .slot-row{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line-cool);font-size:14.5px}
.book-card .slot-row:last-of-type{border-bottom:0}
.book-card .slot-row span{color:var(--muted)}
.book-card .slot-row b{font-weight:600}
.book-card .btn{margin-top:18px}
.book-card .note{margin-top:14px;font-size:13px;color:var(--muted);text-align:center}

/* ---------- schedule table ---------- */
.schedule{border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--paper)}
.schedule th{text-align:left;padding:14px 22px;background:#fff9f6;font-size:13px;font-weight:700;color:var(--muted);border-bottom:1px solid var(--line)}
.schedule td{padding:15px 22px;border-bottom:1px solid var(--line);font-size:15px}
.schedule tr:last-child td{border-bottom:0}
.schedule td:first-child{font-weight:600}
.schedule .off{color:var(--muted)}
.schedule tr.now{background:var(--sage-soft)}
.schedule tr.now td{color:var(--sage);font-weight:600}

/* ---------- credentials list ---------- */
.creds{display:grid;gap:0;border-left:2px solid var(--line)}
.creds li{padding:0 0 26px 26px;position:relative}
.creds li:last-child{padding-bottom:0}
.creds li::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--coral);border:3px solid var(--paper)}
.creds .yr{font-size:13px;font-weight:700;color:var(--coral-text)}
.creds h4{font-family:var(--serif);font-size:18px;margin:4px 0 4px}
.creds p{font-size:14.8px;color:var(--muted)}

/* ---------- timeline / steps ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:st}
.step{counter-increment:st;display:flex;flex-direction:column;gap:12px}
.step .n{width:38px;height:38px;border-radius:50%;background:var(--coral-soft);color:var(--coral-text);display:grid;place-items:center;font-weight:700;font-size:15px;font-family:var(--serif)}
.step .n::before{content:counter(st)}
.step h3{font-size:19px}
.step p{font-size:14.8px;color:var(--muted);line-height:1.55}

/* ---------- listing toolbar (all doctors / all specialities) ---------- */
.toolbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-bottom:26px}
.searchbox{flex:1;min-width:260px;display:flex;align-items:center;gap:12px;border:1.5px solid var(--line-cool);border-radius:99px;padding:4px 6px 4px 20px;background:var(--paper)}
.searchbox svg{flex:none;color:var(--muted)}
.searchbox input{flex:1;border:0;background:none;padding:12px 0;font-size:16px;min-width:0}
.searchbox input:focus{outline:none}
.select{position:relative}
.select select{appearance:none;padding:13px 40px 13px 18px;border:1px solid var(--line-cool);border-radius:99px;background:var(--paper);font-size:15px;cursor:pointer;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%235E6A8A' stroke-width='2.5' stroke-linecap='round'><path d='M5 9l7 7 7-7'/></svg>");background-repeat:no-repeat;background-position:right 16px center}
.select select:hover{border-color:var(--muted)}
.result-line{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;margin-bottom:24px;font-size:15px;color:var(--muted)}
.result-line b{color:var(--ink)}
.clear{background:none;border:0;color:var(--coral-text);font-weight:600;cursor:pointer;font-size:14.5px}

/* A–Z index */
.az{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:26px}
.az button{width:36px;height:36px;border-radius:10px;border:1px solid var(--line-cool);background:var(--paper);font-size:14px;font-weight:600;cursor:pointer;color:var(--muted)}
.az button:hover:not(:disabled){border-color:var(--indigo);color:var(--indigo)}
.az button[aria-pressed="true"]{background:var(--indigo);border-color:var(--indigo);color:#fff}
.az button:disabled{opacity:.35;cursor:not-allowed}

/* tabs */
.tabs{display:flex;gap:8px;border-bottom:1px solid var(--line-cool);margin-bottom:34px;overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs button{padding:15px 20px;background:none;border:0;border-bottom:2px solid transparent;font-size:16px;font-weight:600;color:var(--muted);cursor:pointer;white-space:nowrap}
.tabs button:hover{color:var(--ink)}
.tabs button[aria-selected="true"]{color:var(--coral-text);border-bottom-color:var(--coral)}

/* speciality group listing */
.group{margin-bottom:46px}
.group:last-child{margin-bottom:0}
.group > h3{font-size:23px;margin-bottom:6px}
.group > p{font-size:15px;color:var(--muted);margin-bottom:22px}
.spec-list{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.spec-item{display:flex;gap:15px;align-items:flex-start;background:var(--paper);border:1px solid var(--line-cool);border-radius:var(--r);padding:18px 20px;transition:border-color .16s ease,box-shadow .16s ease}
.spec-item:hover{border-color:var(--coral);box-shadow:var(--shadow-s)}
.spec-item .ic{width:38px;height:38px;border-radius:11px;background:var(--sky);color:var(--indigo);display:grid;place-items:center;flex:none}
.spec-item:nth-child(3n+2) .ic{background:var(--coral-soft);color:var(--coral-text)}
.spec-item:nth-child(3n) .ic{background:var(--sage-soft);color:var(--sage)}
.spec-item strong{display:block;font-size:15.5px;line-height:1.35}
.spec-item span{display:block;font-size:13.5px;color:var(--muted);margin-top:4px}
.spec-item.hidden{display:none}

/* centre cards */
.centres{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.centre{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;transition:box-shadow .2s ease}
.centre:hover{box-shadow:var(--shadow-l)}
.centre .ph{width:190px;flex:none}
.centre .body{padding:26px;display:flex;flex-direction:column;gap:9px}
.centre h3{font-size:21px}
.centre p{font-size:14.5px;color:var(--muted);line-height:1.55}
.centre .lead{margin-top:auto;padding-top:12px;font-size:13.5px;font-weight:600;color:var(--coral-text)}
.centre.hidden{display:none}

/* ---------- outcomes ---------- */
.outcomes{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.outcome{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:28px}
.outcome b{font-family:var(--serif);font-size:40px;font-weight:600;display:block;line-height:1;color:var(--coral-text)}
.outcome strong{display:block;font-size:15.5px;margin-top:12px}
.outcome span{font-size:14px;color:var(--muted);display:block;margin-top:5px;line-height:1.5}

/* ---------- stories ---------- */
.stories{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.story{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;display:flex;flex-direction:column}
.story .mark{font-family:var(--serif);font-size:52px;line-height:.6;color:var(--coral);opacity:.5;margin-bottom:14px}
.story .quote{font-family:var(--serif);font-size:18.5px;line-height:1.5}
.story .by{margin-top:auto;padding-top:24px;display:flex;align-items:center;gap:13px}
.story .by .ph{width:46px;height:46px;border-radius:50%;flex:none}
.story .by strong{display:block;font-size:15px}
.story .by span{font-size:13.5px;color:var(--muted)}
.rating{display:flex;align-items:center;gap:12px;margin-bottom:28px;font-size:15px;color:var(--muted)}
.rating b{font-family:var(--serif);font-size:23px;color:var(--ink)}
.stars{color:var(--coral);letter-spacing:2px}
.story:hover {
    background: #fff9f6;
    /*color:#fff;*/
}
.story .by i:hover {
    background: #fff;
    color: #18214E;
}



/* ---------- FAQ ---------- */
.faq{
    /*max-width:860px;*/
    display:grid;gap:12px}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:var(--r)}
.faq summary{padding:20px 24px;cursor:pointer;font-weight:600;font-size:16.5px;display:flex;justify-content:space-between;gap:20px;align-items:center;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"";width:10px;height:10px;border-right:2px solid var(--muted);border-bottom:2px solid var(--muted);transform:rotate(45deg);flex:none;transition:transform .2s ease;margin-top:-4px}
.faq details[open]{border-color:var(--coral)}
.faq details[open] summary::after{transform:rotate(225deg);margin-top:2px}
.faq .body{padding:0 24px 22px;color:var(--muted);font-size:15.5px;max-width:70ch}

/* ---------- where available ---------- */
.where{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.where-item{background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;display:flex;flex-direction:column;gap:9px}
.where-item h3{font-size:19px}
.where-item address{font-style:normal;font-size:14.5px;color:var(--muted);line-height:1.5}
.where-item .days{font-size:13.5px;font-weight:600;color:var(--sage);margin-top:4px}
.where-item .btn{margin-top:auto;padding-top:0}

/* ---------- closing band ---------- */
/*.band{background:var(--indigo);color:#fff;border-radius:var(--r-xl);padding:52px;display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}*/
/*.band h2{font-size:clamp(27px,3vw,38px);color:#fff;max-width:20ch}*/
/*.band p{margin-top:13px;color:#C9CDF2;max-width:46ch;font-size:16.5px}*/
/*.band-actions{display:flex;gap:12px;flex-wrap:wrap}*/
/*.band .btn-line{background:transparent;border-color:rgba(255,255,255,.42);color:#fff}*/
/*.band .btn-line:hover{background:rgba(255,255,255,.14);border-color:#fff;color:#fff}*/






.sgline {
    display: block!important;
}
.sgline h2 {
    max-width: 28ch;
}
.patient h2 {
    max-width: 100%;
}
.by img {
    width: 50px;
    height: 50px;
    border-radius: 50px;
}

.book-twocol {
    grid-template-columns: 0.35fr .65fr;
}

.shadowbtn {
    background: rgba(255, 255, 255, .16);
    border: 1px solid rgba(255, 255, 255, .34);
    backdrop-filter: blur(6px);
}








/* =====================================================
   VIDEO TESTIMONIALS
===================================================== */

.video-testimonials {
    padding: 90px 0;
    /*background: #f8faf7;*/
    overflow: hidden;
}

.vt-wrap {
    width: 100%;
    max-width: 1325px;
    margin-inline: auto;
    padding-inline: 24px;
    
    /*width: min(1180px, calc(100% - 40px));*/
    /*margin: 0 auto;*/
}


/* Heading */

.vt-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 40px;
    margin-bottom: 38px;
}

.vt-eyebrow {
    display: inline-block;
    margin-bottom: 10px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 1.5px;
    color: #55745f;
}

.vt-heading h2 {
    margin: 0;
    font-size: clamp(32px, 4vw, 48px);
    line-height: 1.1;
    font-weight: 600;
    letter-spacing: -1px;
    color: #18214e;
}

.vt-heading p {
    max-width: 440px;
    margin: 0;
    color: #68718a;
    font-size: 16px;
    line-height: 1.7;
}


/* Carousel */

.vt-carousel {
    position: relative;
    display: flex;
    align-items: center;
}

.vt-track-wrapper {
    width: 100%;
    overflow: hidden;
    margin: 0 55px;
}

.vt-track {
    display: flex;
    gap: 24px;
    transition: transform 0.55s cubic-bezier(.22,.61,.36,1);
    will-change: transform;
}


/* Card */

.vt-card {
    flex: 0 0 calc((100% - 48px) / 3);
    background: #ffffff;
    border: 1px solid #e8ebe6;
    border-radius: 22px;
    overflow: hidden;
    /*box-shadow: 0 12px 35px rgba(24, 33, 78, 0.06);*/
}


/* Video */

.vt-video {
    position: relative;
    width: 100%;
    height: 250px;
    background: #dfe6df;
    overflow: hidden;
}

.vt-video video {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
}


/* Dark overlay */

.vt-video::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to bottom,
        rgba(0,0,0,0.02),
        rgba(0,0,0,0.30)
    );
    pointer-events: none;
}


/* Play button */

.vt-play {
    position: absolute;
    z-index: 3;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

    width: 64px;
    height: 64px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 0;
    border-radius: 50%;

    background: rgba(255,255,255,0.96);
    color: #18214e;

    cursor: pointer;

    box-shadow: 0 8px 30px rgba(0,0,0,.20);

    transition:
        transform .25s ease,
        background .25s ease;
}

.vt-play:hover {
    transform: translate(-50%, -50%) scale(1.08);
    background: #ffffff;
}

.vt-play svg {
    margin-left: 3px;
}


/* Content */

.vt-content {
    padding: 25px;
}

.vt-stars {
    margin-bottom: 12px;
    font-size: 15px;
    letter-spacing: 2px;
    color: #e5a73b;
}

.vt-content h3 {
    margin: 0 0 12px;
    color: #18214e;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 600;
}

.vt-content p {
    margin: 0 0 22px;
    color: #68718a;
    font-size: 14px;
    line-height: 1.65;
}


/* Person */

.vt-person {
    display: flex;
    align-items: center;
    gap: 11px;
}

.vt-avatar {
    width: 40px;
    height: 40px;

    display: flex;
    align-items: center;
    justify-content: center;

    border-radius: 50%;

    background: #e9f0e8;
    color: #4e6c57;

    font-size: 12px;
    font-weight: 700;
}

.vt-person strong {
    display: block;
    color: #18214e;
    font-size: 14px;
}

.vt-person span {
    display: block;
    margin-top: 2px;
    color: #8a91a3;
    font-size: 12px;
}


/* Arrows */

.vt-arrow {
    position: absolute;
    z-index: 5;

    width: 44px;
    height: 44px;

    display: flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #dfe5dd;
    border-radius: 50%;

    background: #ffffff;
    color: #18214e;

    cursor: pointer;

    box-shadow: 0 6px 20px rgba(24,33,78,.08);

    transition:
        background .25s ease,
        color .25s ease,
        transform .25s ease;
}

.vt-arrow:hover {
    background: #18214e;
    color: #ffffff;
    transform: scale(1.05);
}

.vt-prev {
    left: 0;
}

.vt-next {
    right: 0;
}

.vt-arrow:disabled {
    opacity: .35;
    cursor: not-allowed;
    transform: none;
}


/* Bottom */

.vt-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 30px;
}


/* Dots */

.vt-dots {
    display: flex;
    align-items: center;
    gap: 7px;
}

.vt-dot {
    width: 7px;
    height: 7px;
    padding: 0;

    border: 0;
    border-radius: 50%;

    background: #cbd4c9;

    cursor: pointer;

    transition:
        width .3s ease,
        background .3s ease;
}

.vt-dot.active {
    width: 24px;
    border-radius: 10px;
    background: #18214E;
}


/* Reviews link */

.vt-all-reviews {
    color: #18214E;
    text-decoration: none;
    font-size: 14px;
    font-weight: 600;
}

.vt-all-reviews span {
    display: inline-block;
    margin-left: 6px;
    transition: transform .2s ease;
}

.vt-all-reviews:hover span {
    transform: translateX(4px);
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 991px) {

    .video-testimonials {
        padding: 70px 0;
    }

    .vt-heading {
        display: block;
    }

    .vt-heading p {
        margin-top: 15px;
        max-width: 650px;
    }

    .vt-card {
        flex: 0 0 calc((100% - 24px) / 2);
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

    .video-testimonials {
        padding: 60px 0;
    }

    .vt-wrap {
        width: calc(100% - 30px);
    }

    .vt-heading h2 {
        font-size: 32px;
    }

    .vt-heading p {
        font-size: 14px;
        line-height: 1.6;
    }

    .vt-track-wrapper {
        margin: 0;
    }

    .vt-card {
        flex: 0 0 100%;
    }

    .vt-video {
        height: 230px;
    }

    .vt-content {
        padding: 22px;
    }

    .vt-content h3 {
        font-size: 18px;
    }

    .vt-arrow {
        display: none;
    }

    .vt-bottom {
        justify-content: center;
    }

    .vt-all-reviews {
        display: none;
    }

}










.wd_ch h2 {
    max-width: 71ch;
}
.wd_ch {
    display: block;
}
.wd_ch p {
    max-width: 90ch;
}