/* =========================================================
   Studyline UX Enhancement Layer v2
   Responsive / accessibility / conversion / mobile polish
   ========================================================= */
:root{--ux-radius:20px;--ux-focus:0 0 0 4px rgba(95,138,184,.16)}
html{scroll-padding-top:88px}body{min-width:0}
button,a,input,select,textarea{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid rgba(95,138,184,.45);outline-offset:3px}
.header{box-shadow:0 1px 0 rgba(15,34,55,.05);transition:box-shadow .2s,background .2s,transform .28s ease}
.header.scrolled{box-shadow:0 10px 35px rgba(15,34,55,.10);background:rgba(255,255,255,.97)}
.nav{gap:2px}.nav-link{white-space:nowrap}.dropdown-menu{min-width:260px;z-index:1100}
.header-actions{flex-shrink:0}.lang-switch{white-space:nowrap}
.hero{isolation:isolate}.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 15% 10%,rgba(255,255,255,.10),transparent 28%),radial-gradient(circle at 85% 70%,rgba(200,16,46,.12),transparent 30%);pointer-events:none}
.hero-badge{text-decoration:none;transition:transform .18s,box-shadow .18s}
.hero-badge:hover{transform:translateY(-2px);box-shadow:0 6px 16px rgba(200,16,46,.15)}
.hero-content,.hero-visual{position:relative;z-index:2}.hero h1{max-width:780px}.hero .lead{max-width:720px}
/* Home hero background slideshow */
.hero-bg{position:absolute;inset:0;z-index:0;background:#0f2237}
.hero-bg-slide{position:absolute;inset:0;background-size:cover;background-position:center;opacity:0;transform:scale(1.09);transition:opacity 1.1s ease,transform 7s ease-out;will-change:opacity,transform}
.hero-bg-slide.active{opacity:1;transform:scale(1)}
.hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(246,249,252,.97) 0%,rgba(246,249,252,.87) 36%,rgba(246,249,252,.5) 68%,rgba(246,249,252,.08) 100%)}
[dir=rtl] .hero-bg::after{background:linear-gradient(270deg,rgba(246,249,252,.97) 0%,rgba(246,249,252,.87) 36%,rgba(246,249,252,.5) 68%,rgba(246,249,252,.08) 100%)}
.hero::before{z-index:1}.hero .grid-pattern{z-index:1}.hero .container{position:relative;z-index:2}
.hero-slide-dots{position:absolute;left:50%;bottom:18px;transform:translateX(-50%);z-index:3;display:flex;gap:8px;align-items:center}
.hero-slide-dot{width:11px;height:11px;padding:0;border-radius:50%;border:2px solid rgba(26,58,92,.5);background:rgba(255,255,255,.55);cursor:pointer;transition:all .25s ease}
.hero-slide-dot.active{background:var(--accent);border-color:var(--accent);transform:scale(1.25)}
@media (prefers-reduced-motion:reduce){.hero-bg-slide{transition:none;transform:none}}
/* Hero card items & chips as clickable links */
.hero-card-item{display:grid;grid-template-columns:46px minmax(0,1fr) auto;align-items:center;gap:var(--space-4);padding:.8rem .5rem;border-bottom:1px dashed var(--gray-200);text-decoration:none;color:inherit;border-radius:var(--radius-md);transition:background .18s}
.hero-card-item:hover{background:rgba(26,58,92,.05)}
.hero-card-item:last-child{border-bottom:none}
.hc-info{display:flex;flex-direction:column;min-width:0}
.hc-icon{border-radius:50%;overflow:hidden}
.hc-icon svg{display:block}
.hc-arrow{color:var(--gray-400);flex:none;width:16px;height:16px;display:block;transition:transform .18s,color .18s}
.hero-card-item:hover .hc-arrow{color:var(--accent);transform:translateX(3px)}
[dir=rtl] .hero-card-item .hc-arrow{transform:scaleX(-1)}
[dir=rtl] .hero-card-item:hover .hc-arrow{transform:scaleX(-1) translateX(3px)}
.btn{min-height:46px}.btn-sm{min-height:40px}.btn-block{width:100%}
.card,.service-card,.post-card,.testimonial,.compare-card{height:100%}
.service-card{display:flex;flex-direction:column}.service-card .link-arrow{margin-top:auto}
.grid{align-items:stretch}
.section-head{max-width:820px}.section-head h2{letter-spacing:-.4px}
.compare-card,.step-card,.testimonial{border-radius:var(--ux-radius)}
/* Better contact/form UX */
.field{position:relative}.field .input,.field input,.field select,.field textarea{min-height:48px;border-radius:12px;transition:border-color .2s,box-shadow .2s}.field textarea{min-height:120px;resize:vertical}.field .input:focus,.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--secondary);box-shadow:var(--ux-focus)}
.err-msg{display:none}.field.invalid .input,.field.invalid input,.field.invalid select,.field.invalid textarea{border-color:#c8102e;box-shadow:0 0 0 3px rgba(200,16,46,.10)}.field.invalid .err-msg{display:block;color:#b42318;font-size:.78rem;margin-top:5px}
/* Application wizard */
.wizard{overflow:hidden}.wizard-head{position:sticky;top:66px;z-index:20;background:rgba(255,255,255,.97);backdrop-filter:blur(10px)}
.progress-bar-track{height:6px;background:#edf1f5;border-radius:99px;overflow:hidden}.progress-bar-track #progressFill{height:100%;background:linear-gradient(90deg,var(--secondary),var(--primary));border-radius:inherit}
[dir=rtl] .progress-bar-track{transform:scaleX(-1)}
.stepper{overflow-x:auto;scrollbar-width:none}.stepper::-webkit-scrollbar{display:none}.step{min-width:82px}
[dir=rtl] .btn-prev i.fa-arrow-left,[dir=rtl] .btn-next i.fa-arrow-right{transform:scaleX(-1)}
.file-drop{cursor:pointer}.file-drop input[type=file]{position:absolute;inset:0;opacity:0;cursor:pointer}
/* FAQ */
.faq-q{width:100%;text-align:inherit}.faq-a{overflow:hidden}
/* Tables never break the page */
.table-wrap,.table-responsive{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}.data-table,.responsive-table{min-width:680px}
/* Floating contact actions */
.fab{z-index:100}.fab-wa,.fab-call{width:54px;height:54px}
/* Mobile bottom conversion bar */
.mobile-cta{display:none}
.mobile-cta .btn{gap:.5rem;font-size:.92rem;padding:.65rem .75rem;border-radius:12px}.mobile-cta svg{width:1.1em;height:1.1em;flex-shrink:0}
.mobile-cta .btn-outline{color:var(--success);border-color:var(--success)}
.mobile-cta .btn-outline:hover{background:rgba(37,211,102,.1);color:var(--success)}
.mobile-cta .btn-accent{background:var(--accent)}
/* Brand icon SVG sizing inside buttons / lists */
.btn svg,.footer-contact svg,.contact-item svg{width:1em;height:1em;flex-shrink:0;vertical-align:-.125em}
/* Agreement checkbox invalid state */
.check-field.invalid{color:#b42318}
.check-field.invalid input{border-color:#c8102e;box-shadow:0 0 0 3px rgba(200,16,46,.12)}
.check-field input{width:1.2rem;height:1.2rem;accent-color:var(--secondary);flex-shrink:0}
/* image stability */
img[width][height]{height:auto}
/* no horizontal overflow */
.container,.section,.page-hero{overflow:visible}.post-card img,.hero img{object-fit:cover}
/* Tablet */
@media (max-width:1100px){
 .nav-link{padding-inline:.45rem}.header .logo-tag{display:none}
}
@media (max-width:1024px){
 .hero{padding-top:4.5rem}.hero-content{text-align:center}.hero-content .hero-actions,.hero-content .pill-row{justify-content:center}
 .hero-visual{max-width:640px}.contact-wrap{gap:2rem}
}
@media (max-width:768px){
 body{padding-bottom:68px}.topbar{font-size:.72rem}.topbar .container{padding-block:.45rem}.topbar-items{justify-content:center;width:100%}.topbar .topbar-social{display:none}
 .header .container{min-height:66px}.logo-text{font-size:1.08rem}.logo-mark{width:38px;height:38px}.logo-mark img{width:34px;height:34px}
 .mobile-drawer{z-index:2000}.drawer-panel{width:min(92vw,380px);padding:1rem 1rem 1.4rem;overflow-y:auto}
 .hero{padding:3.5rem 0 2.5rem}.hero h1{font-size:clamp(2.05rem,9vw,3.3rem)}.hero .lead{font-size:1rem}
 .hero-actions{display:grid;grid-template-columns:1fr;width:100%}.hero-actions .btn{width:100%}
 .grid-3,.grid-4{grid-template-columns:1fr}.compare-grid,.split,.contact-wrap{grid-template-columns:1fr}.steps-grid{grid-template-columns:1fr}
 .section{padding-block:3.5rem}.section-sm{padding-block:1.75rem}.page-hero{padding-block:3rem 2.5rem}
 .page-hero h1{font-size:clamp(1.8rem,8vw,2.6rem)}
 .cta-band{padding:2rem 1.25rem}.cta-band .btn{width:100%}
 .wizard{border-radius:16px}.wizard-head{top:66px}.wizard-body{padding:1.1rem}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}
 .stepper .step{min-width:66px}.stepper .lbl{display:none}.stepper .step-dot{margin-inline:auto}
 .order-card{position:static!important}.docs-grid{grid-template-columns:1fr}.footer-bottom{flex-direction:column;gap:.75rem;text-align:center}
 .header-actions .lang-switch a{padding:.3rem .5rem;font-size:.8rem}.header-actions .btn{padding-inline:.6rem}
 .mobile-cta{position:fixed;display:grid;grid-template-columns:1fr 1fr;gap:8px;left:0;right:0;bottom:0;padding:8px max(10px,env(safe-area-inset-left)) calc(8px + env(safe-area-inset-bottom)) max(10px,env(safe-area-inset-right));background:rgba(255,255,255,.97);border-top:1px solid var(--gray-200);box-shadow:0 -8px 28px rgba(15,34,55,.12);z-index:1500;backdrop-filter:blur(10px)}
 .mobile-cta a{min-height:46px}.mobile-cta .btn{width:100%}
 .fab{display:none}
}
@media (max-width:480px){
 .container{padding-inline:1rem}.topbar .topbar-items:first-child{display:none}.topbar .container{min-height:30px}
 .hero-visual{margin-inline:.1rem}.hero-card{padding:1rem}.card{padding:1.25rem}.service-card{padding:1.25rem}.testimonial{padding:1.25rem}
 .post-card .post-body{padding:1.1rem}.footer{padding-top:3rem}.footer-grid{gap:2rem}.footer-bottom{font-size:.76rem}
 .btn-lg{min-height:50px}.wizard-head{padding:1rem}.wizard-head .wizard-title{font-size:1.05rem}.progress-meta{font-size:.75rem}
 .page-hero .breadcrumbs{font-size:.72rem}.contact-item{align-items:flex-start}.contact-item p{word-break:break-word}
}
.drawer-lang{display:inline-flex;margin:.75rem 0 .25rem;gap:.35rem}
/* Reading progress bar */
.reading-progress{position:fixed;top:0;left:0;width:0;height:3px;background:linear-gradient(90deg,var(--secondary),var(--primary));z-index:9999;transition:width .15s linear}
/* Scroll to top */
.scroll-top{display:none;position:fixed;bottom:154px;right:22px;z-index:1400;width:42px;height:42px;border-radius:50%;border:none;background:var(--primary);color:#fff;box-shadow:var(--shadow-md);cursor:pointer;align-items:center;justify-content:center;font-size:.95rem;transition:opacity .2s,transform .25s,filter .2s}
.scroll-top:hover{filter:brightness(1.15)}
.scroll-top.visible{display:inline-flex}
[dir=rtl] .scroll-top{right:22px;left:auto;bottom:154px}
/* WhatsApp bubble on FAB */
.fab-wa::before{content:"let's talk";position:absolute;right:calc(100% + 12px);top:50%;transform:translateY(-50%);background:#fff;color:#128c7e;font-size:.76rem;font-weight:700;white-space:nowrap;padding:.45rem .7rem;border-radius:10px;box-shadow:var(--shadow-md);pointer-events:none;animation:bubbleFloat 2.2s ease-in-out infinite alternate}
.fab-wa:hover::before{opacity:0}
[dir=rtl] .fab-wa::before{right:auto;left:calc(100% + 12px)}
@keyframes bubbleFloat{0%{transform:translateY(-50%) translateX(0)}100%{transform:translateY(-50%) translateX(-4px)}}
@media (max-width:340px){.header-actions .btn{display:none}}
@media (prefers-reduced-motion:reduce){.header{transition:none}.mobile-cta{backdrop-filter:none}}
@media print{.topbar,.header,.mobile-drawer,.fab,.mobile-cta,.btn{display:none!important}.section{padding-block:1rem}.card{break-inside:avoid}}
/* Interesting Facts band */
/* Six quick service choices, with room for labels on small screens. */
.hero-card-item { padding-block: .5rem; }
.hc-icon.pink { background: var(--pastel-pink); color: var(--pastel-pink-ink); }

/* Keep the six homepage services readable in a compact overview. */
#Pathways { padding-block: var(--space-8); scroll-margin-top: var(--space-20); }
#Pathways .section-head { margin-bottom: var(--space-6); }
#Pathways .section-head h2 { font-size: var(--text-4xl); line-height: 1.25; }
#Pathways .grid { gap: var(--space-4); }
#Pathways .service-card { padding: var(--space-5); }
#Pathways .service-card .icon-badge {
  width: var(--space-10); height: var(--space-10);
  margin-bottom: var(--space-3); border-radius: var(--radius-full);
}
#Pathways .service-card h3 { font-size: var(--text-lg); line-height: 1.35; margin-bottom: var(--space-2); }
#Pathways .service-card p { font-size: var(--text-sm); line-height: 1.5; margin-bottom: var(--space-3); }
#Pathways .service-card .link-arrow { font-size: var(--text-sm); padding-block: var(--space-1); }
@media (min-width: 1024px) {
  #Pathways .grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  #Pathways .service-card { padding-inline-start: calc(var(--space-10) + var(--space-8)); }
  #Pathways .service-card .icon-badge { position: absolute; inset-inline-start: var(--space-5); top: var(--space-5); }
}
/* Explicit text colours prevent old dark-band styles hiding the copy. */
.benefits-strip .fact-item h3 { color: var(--primary-dark); }
.benefits-strip .fact-item p { color: var(--gray-600); }

/* About introduction: title and story share the first desktop screen. */
.about-page .page-hero { padding-block: var(--space-6); }
.about-page .page-hero h1 { font-size: var(--text-4xl); line-height: 1.2; margin-block: var(--space-3); }
.about-page .page-hero .lead { max-width: 80ch; margin-bottom: 0; font-size: var(--text-base); }
.about-page .about-story { padding-block: var(--space-8); }
.about-story .split { gap: var(--space-8); align-items: center; }
.about-story .frame img { width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
.about-story h2 { font-size: var(--text-3xl); line-height: 1.25; margin-bottom: var(--space-3); }
.about-story p { font-size: var(--text-base); line-height: 1.65; margin-bottom: var(--space-3); }
.about-story p:last-child { margin-bottom: 0; }
@media (min-width: 1024px) {
  .about-story .frame img { height: 300px; }
  .about-story .split { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); }
}

/* Values use a cohesive locally stored photographic triptych. */
.values-section .feature-card { padding: 0; overflow: hidden; text-align: start; }
.value-photo {
  width: 100%; aspect-ratio: 3 / 2;
  background-image: url('../assets/images/values-triptych.png');
  background-size: 300% auto;
  background-repeat: no-repeat;
  background-color: var(--pastel-blue);
}
.value-photo--transparency { background-position: left center; }
.value-photo--results { background-position: center center; }
.value-photo--care { background-position: right center; }
.value-copy { padding: var(--space-5); }
.values-section .feature-card h3 { font-size: var(--text-lg); margin-bottom: var(--space-2); }
.values-section .feature-card p { color: var(--gray-600); margin-bottom: 0; }
.value-photo--transparency + .value-copy { background: var(--pastel-red); }
.value-photo--results + .value-copy { background: var(--pastel-blue); }
.value-photo--care + .value-copy { background: var(--pastel-gold); }

/* Four calm, evenly sized steps without connecting lines or number circles. */
.process-section { padding-block: var(--space-10); scroll-margin-top: var(--space-20); }
.process-section .section-head { margin-bottom: var(--space-8); }
.process-section .steps-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-4); }
.process-section .step-card { height: auto; padding: var(--space-6); text-align: start; box-shadow: none; }
.process-section .step-card::after,
.process-section .steps-grid::before { display: none; }
.process-section .step-num {
  display: block; width: auto; height: auto; min-width: 0;
  margin: 0 0 var(--space-4); padding: 0;
  border: 0; border-radius: 0; background: none; box-shadow: none;
  color: var(--pastel-blue-ink); font-size: var(--text-2xl);
  line-height: 1; font-weight: 700; font-variant-numeric: tabular-nums;
}
.process-section .step-card h4 { font-size: var(--text-base); line-height: 1.4; margin-bottom: var(--space-2); color: var(--primary-dark); }
.process-section .step-card p { font-size: var(--text-sm); line-height: 1.65; color: var(--gray-600); margin-bottom: 0; }
@media (min-width: 640px) {
  .process-section .steps-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .process-section .steps-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}

/* A balanced, self-contained introduction to the company. */
.why-section { padding-block: var(--space-8); scroll-margin-top: var(--space-20); }
.why-section .split { gap: var(--space-8); align-items: center; }
.why-section .frame { box-shadow: none; }
.why-section .frame img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.why-section h2 { font-size: var(--text-3xl); line-height: 1.25; margin-bottom: var(--space-3); }
.why-section .lead { font-size: var(--text-base); line-height: 1.65; margin-bottom: 0; }
.why-section .check-list { margin-top: var(--space-4); }
.why-section .check-list li { font-size: var(--text-sm); padding-block: var(--space-2); line-height: 1.5; }
.why-section .btn { margin-top: var(--space-5); font-size: var(--text-sm); background: var(--primary); }
@media (min-width: 1024px) {
  .why-section .split { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); }
  .why-section .frame img { height: 380px; }
}

/* A quiet, single-action invitation to start an application. */
.application-section .band {
  padding: var(--space-8); background: var(--pastel-blue);
  color: var(--primary-dark); border: 1px solid var(--gray-200);
}
.application-section .band::after { display: none; }
.application-section .band .eyebrow { color: var(--pastel-blue-ink); background: var(--white); }
.application-section .band h2 { color: var(--primary-dark); font-size: var(--text-3xl); line-height: 1.25; margin-bottom: var(--space-3); }
.application-section .band p { color: var(--gray-600); margin-bottom: 0; max-width: 65ch; }
.application-section .band .btn-row { margin-top: var(--space-5); }
.application-section .band .btn { background: var(--primary); color: var(--white); }
.application-section .band .btn:hover { background: var(--primary-dark); }
#ContactForm { scroll-margin-top: var(--space-20); }
@media (min-width: 1024px) {
  .application-section .band { display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: var(--space-10); align-items: center; }
  .application-section .band .eyebrow { grid-column: 1; justify-self: start; }
  .application-section .band h2,
  .application-section .band p { grid-column: 1; }
  .application-section .band .btn-row { grid-column: 2; grid-row: 1 / 4; margin-top: 0; }
}

/* Balance spacing at the application-to-client-stories transition. */
.application-section { padding-bottom: var(--space-6); }
.testimonials-section { padding-top: var(--space-6); padding-bottom: var(--space-10); scroll-margin-top: var(--space-20); }
.testimonials-section .section-head { margin-bottom: var(--space-6); }
.testimonials-section .section-head h2 { margin-bottom: var(--space-3); }
.testimonials-section .section-head p { margin-bottom: 0; }

/* A calm contact section with the form carrying the visual emphasis. */
.contact-section { padding-block: var(--space-10); background: var(--pastel-blue); scroll-margin-top: var(--space-20); }
.contact-section .contact-wrap { grid-template-columns: minmax(0, 1fr); gap: var(--space-8); align-items: center; }
.contact-section h2 { font-size: var(--text-3xl); line-height: 1.25; margin-bottom: var(--space-3); }
.contact-section .lead { font-size: var(--text-base); line-height: 1.65; max-width: 48ch; }
.contact-section .contact-item { gap: var(--space-3); padding-block: var(--space-3); }
.contact-section .contact-item h4 { font-size: var(--text-sm); }
.contact-section .contact-item p { font-size: var(--text-sm); overflow-wrap: anywhere; }
.contact-section .ci-icon { width: var(--space-10); height: var(--space-10); background: var(--white); color: var(--primary); border: 0; }
.contact-section .pill { background: transparent; border: 0; box-shadow: none; padding-inline: 0; color: var(--gray-600); }
.contact-section .pill svg { color: var(--primary); }
.contact-section .contact-form-card { padding: var(--space-6); box-shadow: var(--shadow-sm); border-color: var(--gray-200); }
.contact-section .contact-form-card h3 { margin-bottom: var(--space-5); font-size: var(--text-xl); }
.contact-section .form-grid { gap: var(--space-4); }
.contact-section .input,
.contact-section select { background: var(--gray-50); border-width: 1px; }
.contact-section .contact-form-card .btn { background: var(--primary); color: var(--white); }
.contact-section .contact-form-card .btn:hover { background: var(--primary-dark); }
@media (min-width: 1024px) {
  .contact-section .contact-wrap { grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: var(--space-10); }
  .contact-section .contact-form-card { padding: var(--space-8); }
}

/* Contact page: reduce the empty title area and bring the form into view. */
.contact-page .page-hero { padding-block: var(--space-5); }
.contact-page .page-hero h1 { font-size: var(--text-4xl); line-height: 1.2; margin-block: var(--space-3); }
.contact-page .page-hero .lead { font-size: var(--text-base); margin-bottom: 0; max-width: 75ch; }
.contact-page .contact-main { padding-block: var(--space-6); }
.contact-main .contact-wrap { gap: var(--space-6); align-items: start; }
.contact-main h2 { font-size: var(--text-2xl); line-height: 1.3; margin-bottom: var(--space-3); }
.contact-main .eyebrow { margin-bottom: var(--space-3); }
.contact-main .contact-item { gap: var(--space-3); padding-block: var(--space-3); }
.contact-main .contact-item h4 { font-size: var(--text-sm); }
.contact-main .contact-item p { font-size: var(--text-sm); line-height: 1.5; overflow-wrap: anywhere; }
.contact-main .ci-icon { width: var(--space-10); height: var(--space-10); }
.contact-main .consultation-card { padding: var(--space-5); box-shadow: none; }
.contact-main .consultation-card h3 { font-size: var(--text-xl); line-height: 1.3; margin-bottom: var(--space-4); }
.contact-main .form-grid { gap: var(--space-3); }
.contact-main .field label { margin-bottom: var(--space-1); }
.contact-main .field textarea { min-height: 100px; }
.contact-main .consultation-card .btn { margin-top: var(--space-4) !important; }
@media (min-width: 1024px) {
  .contact-main .contact-wrap { grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr); gap: var(--space-8); }
}

.contact-main .contact-wrap > * { min-width: 0; }
.contact-main .consultation-card .btn { white-space: normal; line-height: 1.4; padding-inline: var(--space-3); }

/* One footer layout and contact block across the entire site. */
.footer { padding-top: var(--space-8); background: var(--white); }
.footer .footer-grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-6); padding-bottom: var(--space-8); }
.footer .footer-grid > * { min-width: 0; }
.footer .footer-brand .logo .brand-logo { width: auto; height: 96px; max-width: 100%; }
.footer .footer-brand p { margin-top: var(--space-3); font-size: var(--text-sm); }
.footer .footer-col h5 { margin-bottom: var(--space-3); font-size: var(--text-sm); }
.footer .footer-col li { margin-bottom: var(--space-2); font-size: var(--text-sm); line-height: 1.6; }
.footer .footer-contact { overflow-wrap: anywhere; }
.footer .socials { margin-top: var(--space-3); }
.footer .socials a { background: var(--pastel-blue); color: var(--primary); border-color: var(--gray-200); }
.footer .socials a:hover { background: var(--primary); color: var(--white); }
.footer .footer-bottom { padding-block: var(--space-4); gap: var(--space-3); flex-wrap: wrap; font-size: var(--text-xs); }
@media (min-width: 640px) {
  .footer .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
  .footer .footer-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .8fr) minmax(0, .8fr) minmax(0, 1.25fr); gap: var(--space-8); }
}

/* One compact title treatment for internal pages. */
.page-hero,
.about-page .page-hero,
.contact-page .page-hero { padding-block: var(--space-6); }
.page-hero h1,
.about-page .page-hero h1,
.contact-page .page-hero h1 {
  font-size: var(--text-4xl); line-height: 1.25;
  margin-block: var(--space-3); color: var(--primary-dark);
}
.page-hero .lead,
.about-page .page-hero .lead,
.contact-page .page-hero .lead { max-width: 80ch; font-size: var(--text-base); line-height: 1.65; margin-bottom: 0; }

/* FAQ rhythm: questions close to the title, with a compact closing invitation. */
.faq-page .faq-main { padding-top: var(--space-6); padding-bottom: var(--space-6); }
.faq-page .accordion { max-width: 900px; margin-inline: auto; }
.faq-page .faq-item { margin-bottom: var(--space-3); }
.faq-page .faq-item:last-child { margin-bottom: 0; }
.faq-page .faq-q {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  gap: var(--space-3); padding: var(--space-4);
  text-align: start; font-size: var(--text-base); line-height: 1.5;
}
.faq-page .faq-a-inner { padding: 0 var(--space-4) var(--space-4); font-size: var(--text-sm); line-height: 1.65; }
.faq-page .faq-contact { padding-block: var(--space-6); }
.faq-page .faq-contact .cta-strip { padding: var(--space-6); gap: var(--space-4); }
.faq-page .faq-contact .cta-strip h3 { font-size: var(--text-2xl); }
.faq-page .faq-contact .cta-strip p { margin-bottom: 0; font-size: var(--text-base); }
.faq-page .faq-contact .btn { white-space: normal; }

/* Long labels and grid children must fit the smallest supported screens. */
.split > *, .cta-strip > * { min-width: 0; }
@media (max-width: 480px) {
  .btn { max-width: 100%; white-space: normal; overflow-wrap: anywhere; text-align: center; }
  .split { grid-template-columns: minmax(0, 1fr); }
  .cta-strip .btn { width: 100%; }
}

@media (max-width: 480px) {
  .eyebrow { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
}

.utility-icon { display: inline-block; width: 1em; height: 1em; flex: 0 0 1em; vertical-align: middle; fill: none; stroke: currentColor; }
.faq-q { font-family: inherit; background: transparent; border: 0; }
.faq-q:focus-visible { outline: 2px solid var(--primary); outline-offset: -3px; }
.fab-wa::before { display: none; }
.values-section { padding-block: var(--space-8); }
.values-section .section-head { margin-bottom: var(--space-6); }
.local-form-note { margin-block: var(--space-3); color: var(--gray-600); font-size: var(--text-sm); line-height: 1.5; }

.mobile-drawer { transition-property: opacity; }

.mobile-drawer { overflow: hidden; }

/* Keep the entire contact card within common desktop viewports. */
.contact-main .consultation-card .local-form-note { margin-bottom: 0; font-size: var(--text-xs); line-height: 1.4; }
@media (min-width: 1024px) {
  .contact-page .page-hero { padding-block: var(--space-4); }
  .contact-main .consultation-card .field textarea { min-height: 80px; height: 80px; }
  .contact-main .consultation-card { padding: var(--space-4); }
}

/* Approved local graduate photo: show the middle scene of the triptych. */
.frame img.education-graduate { display: block; width: 100%; height: 380px; object-fit: cover; object-position: center; }
@media (max-width: 640px) { .frame img.education-graduate { height: 280px; } }

/* ============ RTL (Hebrew) direction fixes ============ */
[dir="rtl"] .alert-info, [dir="rtl"] .notice.info { border-left: 0; border-right: 4px solid var(--info); }
[dir="rtl"] .alert-success, [dir="rtl"] .notice.ok { border-left: 0; border-right: 4px solid var(--success); }
[dir="rtl"] .alert-warning, [dir="rtl"] .notice.warn { border-left: 0; border-right: 4px solid var(--warning); }
[dir="rtl"] .alert-danger { border-left: 0; border-right: 4px solid var(--danger); }
[dir="rtl"] .text-left { text-align: right; }
[dir="rtl"] .step-card { text-align: right; }
[dir="rtl"] .table-wrap th { text-align: right; }
[dir="rtl"] .summary-box .row span:last-child { text-align: left; }
[dir="rtl"] .price-card .whats { text-align: left; }
[dir="rtl"] .timeline::before { left: auto; right: 16px; }
[dir="rtl"] .timeline li { padding: 0 var(--space-10) var(--space-6) 0; }
[dir="rtl"] .timeline li::before { left: auto; right: 10px; }
[dir="rtl"] .post-thumb .post-tag { left: auto; right: 14px; }
[dir="rtl"] .post-meta i { margin-right: 0; margin-left: 4px; }
[dir="rtl"] .badge-float { text-align: center; }