/* V Care U - Old Age Home page layer. Loaded after style.css, vcareu-header.css and vcareu-home.css.
   Seniar page-title, section titles, buttons and animations are reused as they are. */

:root{ --vcu-warm:#F5F2EC; }
.page-title .page-breadcrumb li a{ color:#fff; }
.page-title .page-breadcrumb li a:hover{ color:#ff9aa1; }

/* ---------- 1. Welcome: compact photo + floating quote card, animated reveal ---------- */
.vcu-welcome{ padding:90px 0 70px; }
.vcu-welcome-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:0 90px; align-items:center; max-width:1180px; margin:0 auto; }

/* media */
.vcu-welcome-media{ position:relative; padding:0 0 38px 0; }
.vcu-welcome-frame{ position:absolute; z-index:0; top:26px; left:-22px; right:22px; bottom:12px; border:2px solid rgba(230,0,18,.55); border-radius:28px; transition:transform .7s cubic-bezier(.2,.7,.2,1); }
.vcu-welcome-photo{ position:relative; z-index:1; margin:0; border-radius:28px; overflow:hidden; aspect-ratio:5/4.2; box-shadow:0 34px 60px -38px rgba(9,41,91,.6); }
.vcu-welcome-photo img{ width:100%; height:100%; object-fit:cover; object-position:center 35%; transform:scale(1.04); animation:vcuDrift 22s ease-in-out infinite alternate; }
.vcu-welcome-photo::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(9,41,91,0) 55%, rgba(9,41,91,.28)); }
.vcu-welcome-media:hover .vcu-welcome-frame{ transform:translate(8px,-8px); }

/* floating quote card (uses the section's own lead sentence) */
.vcu-welcome-quote{ position:absolute; z-index:2; right:-34px; bottom:0; display:flex; align-items:center; gap:16px; width:300px; padding:20px 24px; background:#fff; border-radius:20px; box-shadow:0 26px 50px -26px rgba(9,41,91,.55); animation:vcuFloat 6s ease-in-out infinite; }
.vcu-welcome-quote::before{ content:""; position:absolute; left:0; top:20px; bottom:20px; width:4px; border-radius:0 4px 4px 0; background:linear-gradient(180deg,#E60012,var(--theme-color1)); }
.vcu-welcome-heart{ flex:0 0 46px; width:46px; height:46px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:rgba(230,0,18,.1); color:#E60012; font-size:18px; animation:vcuBeat 2.6s ease-in-out infinite; }
.vcu-welcome-quote p{ margin:0; font-size:16.5px; line-height:1.5; font-weight:600; color:var(--theme-color2); }

/* text */
.vcu-welcome .sec-title .title{ font-size:clamp(30px,3vw,44px); line-height:1.1; color:var(--theme-color2); margin-bottom:20px; }
.vcu-welcome-rule{ display:block; width:76px; height:4px; border-radius:4px; background:linear-gradient(90deg,#E60012,var(--theme-color1)); transform-origin:left center; }
.vcu-welcome-text{ margin-top:26px; }
.vcu-welcome-text p{ font-size:17px; line-height:1.85; color:#52637A; margin:0 0 14px; }
.vcu-welcome-text p:last-child{ margin-bottom:0; }

/* reveal animations (driven by the template's WOW.js, which adds .animated on scroll) */
@keyframes vcuReveal{ from{ opacity:0; transform:translateY(34px) scale(.97); clip-path:inset(0 0 14% 0 round 28px); } to{ opacity:1; transform:none; clip-path:inset(0 0 0 0 round 28px); } }
@keyframes vcuGrow{ from{ transform:scaleX(0); } to{ transform:scaleX(1); } }
@keyframes vcuDrift{ from{ transform:scale(1.04) translate(0,0); } to{ transform:scale(1.12) translate(-1.5%,-1%); } }
@keyframes vcuFloat{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-8px); } }
@keyframes vcuBeat{ 0%,100%{ transform:scale(1); } 12%{ transform:scale(1.16); } 24%{ transform:scale(1); } 36%{ transform:scale(1.1); } }
.vcuReveal{ animation-name:vcuReveal; animation-duration:1.1s; animation-timing-function:cubic-bezier(.2,.7,.2,1); }
.vcuGrow{ animation-name:vcuGrow; animation-duration:.9s; animation-timing-function:cubic-bezier(.2,.7,.2,1); }

@media (max-width:1199.98px){ .vcu-welcome-grid{ gap:0 60px; } .vcu-welcome-quote{ right:-20px; width:270px; } }
@media (max-width:991.98px){
  .vcu-welcome{ padding:70px 0 50px; }
  .vcu-welcome-grid{ grid-template-columns:1fr; gap:46px 0; max-width:640px; }
  .vcu-welcome-photo{ aspect-ratio:16/11; }
  .vcu-welcome-quote{ right:12px; }
  .vcu-welcome-frame{ left:-12px; right:12px; }
}
@media (max-width:575.98px){
  .vcu-welcome{ padding:52px 0 40px; }
  .vcu-welcome-media{ padding-bottom:30px; }
  .vcu-welcome-photo{ aspect-ratio:4/3.3; border-radius:22px; }
  .vcu-welcome-frame{ border-radius:22px; top:20px; left:-8px; right:8px; }
  .vcu-welcome-quote{ position:relative; right:auto; bottom:auto; width:auto; margin:-34px 14px 0; padding:16px 18px; }
  .vcu-welcome-quote p{ font-size:15.5px; }
  .vcu-welcome-text p{ font-size:16px; }
}
@media (prefers-reduced-motion:reduce){
  .vcu-welcome-photo img,.vcu-welcome-quote,.vcu-welcome-heart{ animation:none; }
  .vcuReveal,.vcuGrow{ animation-duration:.01ms; }
}

/* ---------- 2. What we offer: centred photo with two points on each side ---------- */
.vcu-offer{ background:#EDF5FF; margin:0 20px; border-radius:30px; padding:80px 0; }
@media (max-width:469.98px){ .vcu-offer{ margin:0 16px; } }
.vcu-offer .sec-title .title{ font-size:clamp(32px,3.4vw,50px); line-height:1.12; color:var(--theme-color2); margin-bottom:18px; }
.vcu-offer-intro{ font-size:17.5px; line-height:1.8; color:#52637A; margin:0 auto; max-width:560px; }
.vcu-offer-grid{ display:grid; grid-template-columns:1fr minmax(300px,380px) 1fr; gap:0 54px; align-items:center; max-width:1240px; margin:56px auto 0; }
.vcu-offer-col{ list-style:none; margin:0; padding:0; display:grid; gap:56px; }

/* centre photo */
.vcu-offer-media{ position:relative; padding:14px; }
.vcu-offer-media img{ position:relative; z-index:1; display:block; width:100%; aspect-ratio:4/5.2; object-fit:cover; object-position:center 40%; border-radius:999px 999px 28px 28px; box-shadow:0 34px 60px -34px rgba(9,41,91,.6); border:6px solid #fff; }
.vcu-offer-glow{ position:absolute; z-index:0; inset:0; border-radius:999px 999px 36px 36px; background:linear-gradient(160deg,rgba(230,0,18,.22),rgba(0,59,142,.28)); animation:vcuGlow 5s ease-in-out infinite alternate; }
@keyframes vcuGlow{ from{ transform:scale(.97); opacity:.7; } to{ transform:scale(1.03); opacity:1; } }

/* points */
.vcu-offer-item{ position:relative; display:flex; align-items:flex-start; gap:20px; }
.vcu-offer-item.is-left{ flex-direction:row-reverse; text-align:right; }
.vcu-offer-icon{ flex:0 0 72px; width:72px; height:72px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#fff; color:var(--theme-color1); border:1px solid rgba(0,59,142,.16); box-shadow:0 16px 30px -20px rgba(9,41,91,.5); transition:background-color .4s ease, color .4s ease, transform .5s ease; }
.vcu-offer-icon i{ line-height:1; }
.vcu-offer-icon i::before{ font-size:34px; line-height:34px; }
.vcu-offer-item:hover .vcu-offer-icon{ background:#E60012; color:#fff; transform:translateY(-4px) rotate(-6deg); border-color:#E60012; }
.vcu-offer-title{ font-size:clamp(21px,1.8vw,25px); line-height:1.25; color:var(--theme-color2); margin:4px 0 8px; }
.vcu-offer-text p{ font-size:16.5px; line-height:1.7; color:#52637A; margin:0; }
.vcu-offer-text{ position:relative; padding-bottom:14px; }
.vcu-offer-text::after{ content:""; position:absolute; bottom:0; width:44px; height:3px; border-radius:3px; background:#E60012; left:0; transition:width .4s ease; }
.vcu-offer-item.is-left .vcu-offer-text::after{ left:auto; right:0; }
.vcu-offer-item:hover .vcu-offer-text::after{ width:84px; }

@media (max-width:1199.98px){ .vcu-offer-grid{ gap:0 34px; grid-template-columns:1fr minmax(280px,340px) 1fr; } .vcu-offer-icon{ flex-basis:60px; width:60px; height:60px; } .vcu-offer-icon i::before{ font-size:28px; line-height:28px; } }
@media (max-width:991.98px){
  .vcu-offer{ padding:60px 0; }
  .vcu-offer-grid{ grid-template-columns:1fr 1fr; gap:34px 36px; margin-top:40px; }
  .vcu-offer-media{ grid-column:1 / -1; grid-row:1; max-width:360px; margin:0 auto; width:100%; }
  .vcu-offer-col{ gap:34px; align-content:start; }
  .vcu-offer-item.is-left{ flex-direction:row; text-align:left; }
  .vcu-offer-item.is-left .vcu-offer-text::after{ left:0; right:auto; }
}
@media (max-width:575.98px){
  .vcu-offer{ padding:48px 0; }
  .vcu-offer-grid{ grid-template-columns:1fr; gap:30px 0; }
  .vcu-offer-col{ gap:30px; }
  .vcu-offer-intro{ font-size:16.5px; }
  .vcu-offer-icon{ flex-basis:56px; width:56px; height:56px; }
  .vcu-offer-text p{ font-size:16px; }
}
@media (prefers-reduced-motion:reduce){ .vcu-offer-glow{ animation:none; } }

/* ---------- 4. Next step: three steps + questions to ask (merged) ---------- */
.vcu-path{ background:#fff; }
.vcu-path .sec-title .title{ font-size:clamp(32px,3.4vw,50px); line-height:1.12; color:var(--theme-color2); }
.vcu-path-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:0 64px; align-items:center; max-width:1200px; margin:0 auto; }

/* steps: vertical timeline */
.vcu-steps-list{ position:relative; list-style:none; margin:0; padding:0; counter-reset:none; }
.vcu-steps-list::before{ content:""; position:absolute; left:27px; top:28px; bottom:28px; border-left:2px dashed rgba(0,59,142,.35); }
.vcu-step{ position:relative; display:flex; gap:26px; padding-bottom:42px; }
.vcu-step:last-child{ padding-bottom:0; }
.vcu-step-no{ position:relative; z-index:1; flex:0 0 56px; width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--theme-color1); color:#fff; font-size:22px; font-weight:600; box-shadow:0 0 0 8px #fff; transition:background-color .35s ease, transform .4s ease; }
.vcu-step:nth-child(2) .vcu-step-no{ background:#E60012; }
.vcu-step:hover .vcu-step-no{ transform:scale(1.08); background:var(--theme-color2); }
.vcu-step-title{ font-size:clamp(22px,1.9vw,27px); line-height:1.25; color:var(--theme-color2); margin:8px 0 10px; }
.vcu-step-body p{ font-size:17px; line-height:1.8; color:#52637A; margin:0; }

/* questions panel */
.vcu-ask-panel{ background:#fff; border-radius:26px; padding:40px 40px 34px; box-shadow:0 30px 56px -34px rgba(9,41,91,.4); border:1px solid rgba(0,59,142,.12); border-top:4px solid #E60012; }
.vcu-ask-eyebrow{ display:block; font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#E60012; margin-bottom:10px; }
.vcu-ask-heading{ font-size:clamp(24px,2.2vw,31px); line-height:1.2; color:var(--theme-color2); margin:0 0 16px; }
.vcu-ask-panel > p{ font-size:16.5px; line-height:1.75; color:#52637A; margin:0 0 10px; }
.vcu-q-list{ list-style:none; margin:22px 0 0; padding:0; border-top:1px solid rgba(0,59,142,.14); }
.vcu-q{ display:flex; gap:16px; padding:18px 0; border-bottom:1px solid rgba(0,59,142,.14); transition:padding-left .35s ease; }
.vcu-q:last-child{ border-bottom:0; padding-bottom:0; }
.vcu-q:hover{ padding-left:8px; }
.vcu-q > i{ flex:0 0 auto; color:var(--theme-color1); font-size:20px; line-height:1.5; margin-top:2px; transition:color .3s ease; }
.vcu-q:hover > i{ color:#E60012; }
.vcu-q-title{ font-size:19px; line-height:1.3; color:var(--theme-color2); margin:0 0 4px; }
.vcu-q p{ font-size:15.5px; line-height:1.65; color:#52637A; margin:0; }

@media (max-width:991.98px){
  .vcu-path-grid{ grid-template-columns:1fr; gap:46px 0; max-width:680px; }
}
@media (max-width:575.98px){
  .vcu-steps-list::before{ left:23px; }
  .vcu-step{ gap:18px; padding-bottom:34px; }
  .vcu-step-no{ flex-basis:48px; width:48px; height:48px; font-size:19px; box-shadow:0 0 0 6px #fff; }
  .vcu-step-body p{ font-size:16px; }
  .vcu-ask-panel{ padding:28px 22px 26px; border-radius:22px; }
}

/* ---------- 6. Enquiry CTA: compact navy band (no photo) ---------- */
.vcu-ocal{ position:relative; margin:60px 20px 60px; padding:56px 0; border-radius:30px; overflow:hidden; background:linear-gradient(110deg,#09295B 0%,#0a3f8f 100%); }
.vcu-ocal::before{ content:""; position:absolute; right:-70px; top:-110px; width:320px; height:320px; border-radius:50%; background:rgba(255,255,255,.06); }
.vcu-ocal .auto-container{ position:relative; z-index:1; }
@media (max-width:469.98px){ .vcu-ocal{ margin:44px 16px 36px; } }
.vcu-ocal-eyebrow{ display:inline-block; font-size:13px; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color:#ff9aa1; margin-bottom:12px; }
.vcu-ocal-title{ font-size:clamp(26px,2.6vw,38px); line-height:1.18; color:#fff; margin:0 0 14px; max-width:620px; }
.vcu-ocal-copy p{ font-size:16.5px; line-height:1.75; color:rgba(237,245,255,.85); margin:0; max-width:600px; }
.vcu-ocal-actions{ display:flex; flex-direction:column; align-items:flex-start; gap:18px; }
.vcu-ocal-actions .btn-style-one.light .btn-title{ color:var(--theme-color2); }
.vcu-ocal-actions .btn-style-one.light .btn-arrow-left,.vcu-ocal-actions .btn-style-one.light .btn-arrow-right{ background:#E60012; color:#fff; }
.vcu-ocal-tiles{ display:grid; grid-template-columns:1fr 1fr; gap:12px; width:100%; max-width:520px; }
.vcu-ocal-tiles a{ display:flex; align-items:center; gap:12px; padding:12px 14px; border:1px solid rgba(255,255,255,.28); border-radius:14px; background:rgba(255,255,255,.08); color:#fff; font-size:16.5px; font-weight:600; transition:background-color .35s ease, transform .35s ease; }
.vcu-ocal-tiles a:hover{ background:rgba(255,255,255,.18); transform:translateY(-3px); }
.vcu-ocal-tiles i{ flex:0 0 36px; width:36px; height:36px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#E60012; font-size:13px; }
.vcu-ocal-tiles small{ display:block; font-size:11px; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:rgba(237,245,255,.7); margin-bottom:1px; }
@media (max-width:1199.98px){ .vcu-ocal-tiles{ grid-template-columns:1fr; max-width:360px; } }
@media (max-width:991.98px){ .vcu-ocal{ margin:44px 20px 40px; padding:44px 0; } .vcu-ocal-tiles{ grid-template-columns:1fr 1fr; max-width:520px; } }
@media (max-width:575.98px){ .vcu-ocal{ padding:38px 0; } .vcu-ocal-copy p{ font-size:16px; } .vcu-ocal-tiles{ grid-template-columns:1fr; } }

/* welcome: keep the long heading from leaving a lone word, and the label on one line on phones */
.vcu-welcome .sec-title .title{ max-width:520px; text-wrap:balance; }
@media (max-width:575.98px){
  .vcu-welcome .sec-sub-title{ max-width:100%; }
  .vcu-welcome .sec-sub-title .sub-title{ font-size:12.5px; letter-spacing:.04em; white-space:nowrap; }
}

/* next step: steps fill the same height as the questions panel (no empty space above/below) */
.vcu-path-grid{ align-items:stretch; }
.vcu-steps-list{ display:flex; flex-direction:column; gap:20px; height:100%; }
.vcu-steps-list::before{ display:none; }
.vcu-step{ flex:1 1 0; align-items:center; gap:24px; padding:26px 30px; background:#EDF5FF; border:1px solid rgba(0,59,142,.1); border-radius:22px; transition:transform .45s ease, box-shadow .45s ease, background-color .35s ease; }
.vcu-step:last-child{ padding-bottom:26px; }
.vcu-step:hover{ transform:translateY(-4px); background:#fff; box-shadow:0 24px 44px -30px rgba(9,41,91,.45); }
.vcu-step-no{ box-shadow:none; }
.vcu-step-title{ margin:0 0 8px; }
@media (max-width:991.98px){ .vcu-steps-list{ height:auto; } .vcu-step{ flex:none; } }
@media (max-width:575.98px){ .vcu-step{ padding:20px 18px; gap:16px; align-items:flex-start; } .vcu-step:last-child{ padding-bottom:20px; } }