/*
Theme Name: Premier Psychology Centre
Theme URI: https://premier2u.com
Author: Premier Psychology Centre
Author URI: https://premier2u.com
Description: Custom theme for Premier Psychology Centre (premier2u.com), Seksyen 9, Shah Alam. Mental health screening, psychological assessment and psychotherapy, in person or online. Converted from the original single-file site into a standard WordPress classic theme.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: premier2u
*/

:root{
  --ink:#1E3A5F; --ink-soft:#3B5878; --body:#42607e;
  --cream:#FBF6E8; --paper:#FFFFFF; --sky:#EAF2F9; --sky-deep:#D9E8F4;
  --p-teal:#2E9DA6; --p-blue:#2E6FB5; --p-green:#7FB43C;
  --p-gold:#F3B32F; --p-orange:#F0862F; --p-red:#E0492E;
  --line:#D8E3EE; --ok:#2E9DA6; --warn:#F0862F; --bad:#E0492E;
  --shadow:0 10px 30px rgba(30,58,95,.10);
  --r:18px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Jost',sans-serif;color:var(--body);background:var(--sky);line-height:1.6;font-size:16px}
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;color:var(--ink);line-height:1.15;font-weight:600}
.script{font-family:'Allura',cursive;font-weight:400;color:var(--ink)}
img{max-width:100%}
button{font-family:'Jost',sans-serif;cursor:pointer}
input,select,textarea{font-family:'Jost',sans-serif;font-size:15px;color:var(--ink);width:100%;padding:11px 14px;border:1.5px solid var(--line);border-radius:12px;background:#fff;outline:none;transition:.2s}
input:focus,select:focus,textarea:focus{border-color:var(--p-blue);box-shadow:0 0 0 3px rgba(46,111,181,.12)}
label{display:block;font-size:13px;font-weight:600;color:var(--ink);letter-spacing:.4px;margin:0 0 5px;text-transform:uppercase}
.field{margin-bottom:14px}
.hint{font-size:12.5px;color:#7d93a8;margin-top:4px}
::placeholder{color:#9fb2c4}

/* ===== Flower logo (CSS) ===== */
.flower{position:relative;width:44px;height:44px;flex:0 0 auto}
.flower i{position:absolute;left:50%;top:50%;width:16px;height:26px;border-radius:60% 60% 60% 60%/70% 70% 50% 50%;transform-origin:50% 100%}
.flower i:nth-child(1){background:var(--p-gold);transform:translate(-50%,-100%) rotate(0deg)}
.flower i:nth-child(2){background:var(--p-orange);transform:translate(-50%,-100%) rotate(60deg)}
.flower i:nth-child(3){background:var(--p-red);transform:translate(-50%,-100%) rotate(120deg)}
.flower i:nth-child(4){background:var(--p-blue);transform:translate(-50%,-100%) rotate(180deg)}
.flower i:nth-child(5){background:var(--p-teal);transform:translate(-50%,-100%) rotate(240deg)}
.flower i:nth-child(6){background:var(--p-green);transform:translate(-50%,-100%) rotate(300deg)}
.flower.spin{animation:spin 8s linear infinite}
.logomark{display:block}
.photo{width:100%;height:100%;object-fit:cover;display:block}
.mphoto{height:150px;border-radius:12px;overflow:hidden;margin-bottom:14px;background:var(--sky)}
.hero-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-veil{position:absolute;inset:0;background:linear-gradient(180deg,rgba(251,246,232,.95),rgba(251,246,232,.78) 55%,var(--sky))}
.hero .wrap{position:relative;z-index:2}
.band{position:relative;height:340px;overflow:hidden}
.band img{width:100%;height:100%;object-fit:cover}
.band .quote{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:rgba(22,48,79,.42);color:#fff;text-align:center;padding:0 20px}
.band .quote .script{color:#fff;font-size:clamp(44px,6vw,72px);text-shadow:0 2px 18px rgba(0,0,0,.35)}
.band .quote p{font-size:16px;max-width:560px;text-shadow:0 1px 10px rgba(0,0,0,.4)}
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px}
.tcard{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--shadow);text-align:center;padding-bottom:22px}
.tcard .ph{height:250px;overflow:hidden;background:var(--sky)}
.tcard h3{font-size:20px;margin:16px 0 2px}
.tcard .role{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;font-weight:600;color:var(--p-teal)}
.tcard p{font-size:13.5px;padding:0 18px;margin-top:8px}

@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.flower.spin{animation:none}}

.brandline{display:flex;align-items:center;gap:12px}
.brandline .name{font-family:'Cormorant Garamond',serif;color:var(--ink);font-weight:700;font-size:19px;letter-spacing:2.5px;line-height:1}
.brandline .name small{display:block;font-family:'Jost';font-weight:600;font-size:9.5px;letter-spacing:3.5px;color:var(--p-blue)}

/* ===== Buttons ===== */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 26px;border-radius:999px;border:none;font-weight:600;font-size:15px;letter-spacing:.3px;transition:.22s;text-decoration:none}
.btn-ink{background:var(--ink);color:#fff}
.btn-ink:hover{background:#16304f;transform:translateY(-1px)}
.btn-teal{background:var(--p-teal);color:#fff}
.btn-teal:hover{background:#25858d;transform:translateY(-1px)}
.btn-orange{background:var(--p-orange);color:#fff}
.btn-orange:hover{background:#d97522}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff}
.btn-line{background:#fff;color:var(--ink);border:1.5px solid var(--line)}
.btn-line:hover{border-color:var(--ink)}
.btn-sm{padding:8px 16px;font-size:13.5px}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn:focus-visible,a:focus-visible{outline:3px solid var(--p-gold);outline-offset:2px}

/* ===== App shell / views ===== */
.view{display:none}
.view.active{display:block}
.wrap{max-width:1160px;margin:0 auto;padding:0 22px}

/* ===== Public site ===== */
#siteNav{position:sticky;top:0;z-index:60;background:rgba(251,246,232,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(30,58,95,.08)}
#siteNav .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:14px}
#siteNav .links{display:flex;gap:26px;align-items:center}
#siteNav .links a{color:var(--ink-soft);text-decoration:none;font-weight:500;font-size:15px}
#siteNav .links a:hover{color:var(--p-teal)}
.navbtns{display:flex;gap:10px}
.hamb{display:none;background:none;border:none;font-size:26px;color:var(--ink)}

.hero{background:linear-gradient(180deg,var(--cream) 0%,#F3EEDB 60%,var(--sky) 100%);position:relative;overflow:hidden;padding:84px 0 110px;text-align:center}
.hero .eyebrow{font-size:13px;letter-spacing:5px;font-weight:600;color:var(--p-blue);text-transform:uppercase}
.hero h1{font-size:clamp(34px,5.4vw,64px);margin:16px auto 8px;max-width:820px}
.hero .script-line{font-size:clamp(44px,7vw,86px);display:block;margin:-6px 0 4px;position:relative}
.hero .script-line::before,.hero .script-line::after{content:"";position:absolute;top:58%;width:16vw;max-width:190px;height:1.5px;background:var(--ink);opacity:.55}
.hero .script-line::before{right:calc(50% + 200px)}
.hero .script-line::after{left:calc(50% + 200px)}
.hero p.lead{max-width:620px;margin:14px auto 30px;font-size:17.5px}
.hero .cta{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.hero .bigflower{position:absolute;width:340px;left:-70px;top:-40px;opacity:.07;z-index:1}
.hero .bigflower2{position:absolute;width:340px;right:-80px;bottom:-70px;opacity:.07;z-index:1}

.strip3{display:grid;grid-template-columns:repeat(2,1fr);max-width:860px;margin-left:auto;margin-right:auto;gap:18px;margin-top:-56px;position:relative;z-index:5}
.mode-card{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:26px 24px;border-top:5px solid var(--p-teal);transition:.25s}
.mode-card:nth-child(2){border-top-color:var(--p-blue)}
.mode-card:nth-child(3){border-top-color:var(--p-orange)}
.mode-card:hover{transform:translateY(-4px)}
.mode-card h3{font-size:23px;margin-bottom:6px}
.mode-card p{font-size:14.5px;margin-bottom:14px}
.tagchip{display:inline-block;font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--p-teal);margin-bottom:8px}
.mode-card:nth-child(2) .tagchip{color:var(--p-blue)}
.mode-card:nth-child(3) .tagchip{color:var(--p-orange)}

section.pad{padding:88px 0}
.sec-head{text-align:center;max-width:640px;margin:0 auto 48px}
.sec-head .script{font-size:clamp(38px,5vw,58px);display:block}
.sec-head h2{font-size:clamp(26px,3.4vw,38px)}
.sec-head p{margin-top:10px}

.svc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:18px}
.svc{background:var(--cream);border-radius:var(--r);padding:26px;position:relative;overflow:hidden;border:1px solid rgba(30,58,95,.06)}
.svc .sphoto{height:172px;margin:-26px -26px 18px;border-radius:18px 18px 0 0;overflow:hidden;background:var(--sky)}
.corp{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px;margin-top:44px}
.corp .c{background:var(--ink);color:#cfe0ef;border-radius:var(--r);padding:24px}
.corp .c h3{color:#fff;font-size:20px;margin-bottom:6px}
.corp .c p{font-size:14px}
.corp .c .pill{margin-bottom:10px}
.svc .dot{width:38px;height:38px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:19px;margin-bottom:14px;color:#fff}
.svc h3{font-size:21px;margin-bottom:6px}
.svc p{font-size:14.5px}
.svc .price{margin-top:12px;font-weight:600;color:var(--ink);font-size:14px}

.cond-wrap{background:var(--ink);border-radius:26px;padding:56px 40px;color:#cfe0ef;text-align:center}
.cond-wrap h2{color:#fff;font-size:clamp(26px,3.2vw,36px)}
.cond-wrap .script{color:var(--p-gold);font-size:46px}
.cond-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:26px}
.cond{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);padding:9px 20px;border-radius:999px;font-size:14.5px;color:#EAF2F9}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;counter-reset:st}
.step{background:#fff;border-radius:var(--r);padding:26px;box-shadow:var(--shadow)}
.step .n{font-family:'Cormorant Garamond',serif;font-size:44px;font-weight:700;color:var(--sky-deep);line-height:1}
.step h3{font-size:20px;margin:8px 0 6px}
.step p{font-size:14.5px}

footer{background:var(--ink);color:#b9cde0;padding:56px 0 30px;margin-top:0}
footer .cols{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:34px}
footer h4{color:#fff;font-family:'Jost';font-size:14px;letter-spacing:2px;text-transform:uppercase;margin-bottom:14px}
footer a{color:#b9cde0;text-decoration:none;display:block;margin-bottom:8px;font-size:14.5px}
footer a:hover{color:var(--p-gold)}
footer .fine{border-top:1px solid rgba(255,255,255,.12);margin-top:38px;padding-top:20px;font-size:13px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}

/* ===== Portal & CMS shared ===== */
.appbar{background:var(--ink);color:#fff;position:sticky;top:0;z-index:70}
.appbar .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.appbar .name{color:#fff}
.appbar .name small{color:var(--p-gold)}
.appbar .btn{padding:8px 18px;font-size:13.5px}

.stepper{display:flex;gap:0;justify-content:center;margin:34px 0 30px;flex-wrap:wrap}
.stp{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#8ba3ba;padding:0 14px;position:relative}
.stp .b{width:30px;height:30px;border-radius:50%;background:#fff;border:2px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:13px}
.stp.done .b{background:var(--p-teal);border-color:var(--p-teal);color:#fff}
.stp.now{color:var(--ink)}
.stp.now .b{border-color:var(--ink);color:var(--ink)}
.card{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:30px;max-width:760px;margin:0 auto 40px}
.card.wide{max-width:1000px}
.card h2{font-size:26px;margin-bottom:4px}
.card .sub{font-size:14.5px;margin-bottom:22px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:0 18px}
.choice{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:6px 0 4px}
.choice button{background:var(--sky);border:2px solid transparent;border-radius:var(--r);padding:22px 18px;text-align:left;transition:.2s}
.choice button:hover{border-color:var(--p-blue)}
.choice button.sel{border-color:var(--p-teal);background:#eafaf9}
.choice h3{font-size:19px;margin-bottom:4px}
.choice p{font-size:13.5px}
.row-end{display:flex;justify-content:flex-end;gap:12px;margin-top:18px;flex-wrap:wrap}
.row-between{display:flex;justify-content:space-between;gap:12px;margin-top:18px;flex-wrap:wrap}
.consent{display:flex;gap:10px;align-items:flex-start;background:var(--cream);padding:14px 16px;border-radius:12px;margin:8px 0 4px}
.consent input{width:18px;height:18px;margin-top:3px}
.consent span{font-size:13.5px}

.qnum{font-family:'Cormorant Garamond',serif;font-size:88px;font-weight:700;color:var(--ink);line-height:1}
.waitbox{text-align:center;padding:10px 0}
.pulse{width:14px;height:14px;border-radius:50%;background:var(--p-teal);display:inline-block;animation:pl 1.6s infinite}
@keyframes pl{0%{box-shadow:0 0 0 0 rgba(46,157,166,.5)}70%{box-shadow:0 0 0 14px rgba(46,157,166,0)}100%{box-shadow:0 0 0 0 rgba(46,157,166,0)}}
.calm{background:var(--sky);border-radius:14px;padding:16px 18px;font-size:14.5px;margin-top:22px;text-align:left}

.vid{background:#0e2033;border-radius:var(--r);aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;color:#7fa0c0;flex-direction:column;gap:10px;position:relative;overflow:hidden}
.vid .selfview{position:absolute;right:14px;bottom:14px;width:150px;aspect-ratio:4/3;background:#1c3550;border-radius:10px;border:1px solid rgba(255,255,255,.2);display:flex;align-items:center;justify-content:center;font-size:12px}
.chatbox{border:1.5px solid var(--line);border-radius:14px;display:flex;flex-direction:column;height:100%;min-height:320px}
.chatlog{flex:1;overflow-y:auto;padding:14px;display:flex;flex-direction:column;gap:8px}
.msg{max-width:82%;padding:9px 13px;border-radius:14px;font-size:14px}
.msg.me{align-self:flex-end;background:var(--ink);color:#fff;border-bottom-right-radius:4px}
.msg.them{align-self:flex-start;background:var(--sky);border-bottom-left-radius:4px}
.chatin{display:flex;gap:8px;padding:10px;border-top:1.5px solid var(--line)}
.consult-grid{display:grid;grid-template-columns:1.6fr 1fr;gap:18px}

table{width:100%;border-collapse:collapse;font-size:14px}
th{background:var(--sky);color:var(--ink);text-align:left;padding:11px 12px;font-weight:600;font-size:12.5px;letter-spacing:.6px;text-transform:uppercase}
td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:middle}
tr:hover td{background:#fbfdff}
.pill{display:inline-block;padding:4px 12px;border-radius:999px;font-size:12px;font-weight:600}
.pill.teal{background:#e2f5f4;color:#1d7c84}
.pill.blue{background:#e5effa;color:#2E6FB5}
.pill.gold{background:#fdf2d8;color:#a9760e}
.pill.orange{background:#fdeadb;color:#c05f12}
.pill.red{background:#fbe3de;color:#c03a22}
.pill.green{background:#edf6dd;color:#5c8722}
.pill.grey{background:#eef2f6;color:#5c7288}

/* CMS layout */
.cms{display:grid;grid-template-columns:230px 1fr;min-height:calc(100vh - 64px)}
.side{background:#16304F;padding:22px 14px;display:flex;flex-direction:column;gap:4px}
.side button{display:flex;align-items:center;gap:11px;background:none;border:none;color:#9db6cf;padding:12px 14px;border-radius:12px;font-size:14.5px;font-weight:500;text-align:left;width:100%}
.side button:hover{background:rgba(255,255,255,.06);color:#fff}
.side button.on{background:var(--p-teal);color:#fff}
.side .grp{font-size:10.5px;letter-spacing:2.5px;color:#5f7d9c;margin:16px 12px 6px;text-transform:uppercase;font-weight:700}
.main{padding:30px;background:var(--sky);min-width:0}
.main h1{font-size:30px;margin-bottom:2px}
.main .sub{font-size:14px;margin-bottom:22px}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:22px}
.kpi{background:#fff;border-radius:16px;padding:20px 22px;box-shadow:var(--shadow);border-left:5px solid var(--p-teal)}
.kpi:nth-child(2){border-left-color:var(--p-blue)}
.kpi:nth-child(3){border-left-color:var(--p-gold)}
.kpi:nth-child(4){border-left-color:var(--p-orange)}
.kpi .v{font-family:'Cormorant Garamond',serif;font-size:36px;font-weight:700;color:var(--ink);line-height:1.1}
.kpi .l{font-size:12.5px;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:#7d93a8}
.panel{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);padding:24px;margin-bottom:20px;min-width:0;overflow-x:auto}
.panel h3{font-size:20px;margin-bottom:14px}
.two{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.regime{display:flex;flex-wrap:wrap;gap:8px}
.regime button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:7px 15px;font-size:13px;color:var(--ink-soft)}
.regime button.sel{background:var(--p-teal);border-color:var(--p-teal);color:#fff}
.billrow{display:grid;grid-template-columns:2fr 80px 110px 40px;gap:10px;margin-bottom:10px;align-items:center}
.total{font-family:'Cormorant Garamond',serif;font-size:30px;font-weight:700;color:var(--ink)}
canvas{max-width:100%}
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(90px);background:var(--ink);color:#fff;padding:13px 26px;border-radius:999px;font-size:14.5px;box-shadow:var(--shadow);transition:.35s;z-index:99;opacity:0}
.toast.show{transform:translateX(-50%) translateY(0);opacity:1}
.notice{background:var(--cream);border-left:4px solid var(--p-gold);padding:13px 16px;border-radius:10px;font-size:13.5px;margin:14px 0}
.receipt{border:2px dashed var(--line);border-radius:14px;padding:22px;background:var(--cream)}
.big-ok{width:74px;height:74px;border-radius:50%;background:var(--p-teal);color:#fff;font-size:36px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px}

@media(max-width:960px){
  .strip3{grid-template-columns:1fr}
  .cms{grid-template-columns:1fr}
  .side{flex-direction:row;overflow-x:auto;position:sticky;top:64px;z-index:50;padding:10px}
  .side .grp{display:none}
  .side button{white-space:nowrap;width:auto}
  .consult-grid,.two{grid-template-columns:1fr}
  footer .cols{grid-template-columns:1fr}
  .hero .script-line::before,.hero .script-line::after{display:none}
}
@media(max-width:760px){
  #siteNav .links{display:none;position:absolute;top:74px;left:0;right:0;background:var(--cream);flex-direction:column;padding:20px;gap:16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  #siteNav .links.open{display:flex}
  .hamb{display:block}
  .grid2,.grid3,.choice{grid-template-columns:1fr}
  .main{padding:18px}
  .card{padding:22px}
}
@media print{
  .appbar,.side,.no-print,#siteNav{display:none!important}
  .main{padding:0}
  body{background:#fff}
  .panel,.card{box-shadow:none;border:1px solid #ccc}
}


/* ===== Page templates (Privacy, Terms, blog), added for WP theme ===== */
.page-main{min-height:60vh}
.legal-content{color:var(--body);font-size:15.5px}
.legal-content h2{font-size:22px;margin:26px 0 8px}
.legal-content h2:first-child{margin-top:0}
.legal-content h3{font-size:18px;margin:20px 0 6px}
.legal-content p{margin:0 0 12px}
.legal-content ul,.legal-content ol{margin:0 0 14px 22px}
.legal-content li{margin-bottom:6px}
.legal-content a{color:var(--p-blue);text-decoration:underline}
.legal-content a:hover{color:var(--p-teal)}
.page-main .pagination{margin-top:20px}

/* ===== Booking page ===== */
.booking-layout{display:grid;grid-template-columns:1.7fr 1fr;gap:22px;align-items:start}
.booking-aside .card h3{font-size:19px}
.booking-form .grid2,.booking-form .grid3{margin-bottom:0}
.booking-success .big-ok{margin-bottom:16px}
@media(max-width:860px){
  .booking-layout{grid-template-columns:1fr}
}

/* ===== Setmore embed ===== */
.setmore-embed{background:#fff;border-radius:var(--r);box-shadow:var(--shadow);overflow:hidden;max-width:900px;margin:0 auto}
.setmore-embed iframe{display:block;width:100%;min-height:760px;border:0}
@media(max-width:600px){.setmore-embed iframe{min-height:680px}}

/* Show the baked-in caption on service/mode photos (crop from the bottom) */
.sphoto .photo,.mphoto .photo{object-position:top}