/* ============================================================
   GACA — Gopal & Anil Chartered Accountants
   Design tokens: trusted deep blue + amber-yellow accent
   Display: Montserrat  |  Body: Assistant  |  Accent: Alegreya  |  Utility: IBM Plex Mono
   Signature motif: ledger lines + flat-illustration desk scene + chart-of-account codes
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300..700;1,300..700&family=DM+Serif+Display:ital@0;1&display=swap');

:root{
  --navy: #0B2E59;          /* primary trust blue */
  --navy-deep: #071F3C;     /* deepest blue — footer / darkest panels */
  --navy-soft: #123C66;     /* mid blue — hero panels */
  --blue-accent: #1D5FA3;   /* brighter blue — links, icons, hover */
  --blue-tint: #E9F0F8;     /* pale blue tint for card backgrounds */
  --gold: #FFAA17;          /* signature amber-yellow — CTAs & highlights */
  --real-gold: #B59410;
  --gold-light: #FFC65C;    /* lighter yellow for dark-bg text/accents */
  --gold-pale: #F0E0B0;
  --gold-deep: #E0940A;     /* pressed / hover state for yellow buttons */
  --ivory: #F6F8FB;         /* page background — cool off-white */
  --paper: #FFFFFF;         /* card background */
  --ink: #1B2430;           /* body text — deep blue-charcoal */
  --ink-soft: #57626F;      /* secondary text */
  --teal: #1D5FA3;          /* alias: link/hover accent (blue) */
  --line: #DEE5EF;          /* hairline dividers */
  --line-soft: #EAF0F7;

  --font-display: "Montserrat", "Segoe UI", Arial, sans-serif;
  --font-body: "Assistant", "Segoe UI", Arial, sans-serif;
  --font-accent: "Alegreya", Georgia, serif;
  --font-serif:'DM Serif Display', 'Cormorant Garamond', serif;
  --font-mono: "IBM Plex Mono", "Courier New", monospace;
	--font-menu:"Poppins"."Segoe UI", Arial, sans-serif;

  --radius: 4px;
  --radiuslg: 24px;
}

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

html{ scroll-behavior: smooth; }
body{
  margin:0;
  font-family: var(--font-body);
  color: var(--ink);
  background: var(--ivory);
  line-height: 1.75;
  font-size: 18.5px;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
}
img{ max-width:100%; display:block; }
a{ color: inherit; text-decoration: none; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{
  font-family: var(--font-display);
  color: var(--navy);
  margin: 0 0 .5em;
  font-weight: 700;
  letter-spacing: -0.01em;
  line-height: 1.2;
}
p{ margin: 0 0 1.15em; color: var(--ink); font-size: 1rem; }

:focus-visible{
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

.hero{padding:50px 0px; }
.logo-big img{ max-width: 100%; margin:0 auto; display:block;}
.container,
.container-fluid,
.container-xxl,
.container-xl,
.container-lg,
.container-md,
.container-sm {
	  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 576px) {
  .container-sm, .container {
    max-width: 540px;
  }
}
@media (min-width: 768px) {
  .container-md, .container-sm, .container {
    max-width: 720px;
  }
  
}
@media (min-width: 992px) {
  .container-lg, .container-md, .container-sm, .container {
    max-width: 960px;
  }
  
  .team-card .photo{ /*aspect-ratio: 4/5; overflow:hidden; background:var(--line-soft);  */
	position: relative;   width: 150px;  height: 170px;}
	
	.hero{padding:30px 0px; }
	
}
@media (min-width: 1200px) {
  .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1140px;
  }
  .hero{padding:40px 0px; }
  
  .logo-big img{ max-width: 100%; width:600px; margin:0 auto; display:block;}
}
@media (min-width: 1400px) {
  .container-xxl, .container-xl, .container-lg, .container-md, .container-sm, .container {
    max-width: 1320px;
  }
  .hero{padding:70px 0px; }
}



 .link-btn {color:var(--teal); font-weight:700; font-size:18px;  transform: translateY(24px) scale(.75);
  transition: opacity .35s ease, visibility .35s ease, transform .4s cubic-bezier(.34,1.56,.64,1), background .25s ease, box-shadow .25s ease;
}

.link-btn:hover {color:var(--gold); transform: translateY(-6px) scale(1.06); }




/* ---------- ledger rule + paper motifs ---------- */
.ledger-rules{
  background-image: repeating-linear-gradient(
    to bottom,
    transparent 0, transparent 42px,
    rgba(11,46,89,0.05) 42px, rgba(11,46,89,0.05) 43px
  );
}
.paper-texture{
  background-image: url("../images/paper-texture.svg");
  background-size: 220px 220px;
  background-blend-mode: multiply;
}
.hairline{
  border: none;
  border-top: 1px solid var(--line);
  margin: 0;
}
.eyebrow{
  font-family: var(--font-mono);
  font-size: 13.5px;
  letter-spacing: .16em;
  text-transform: uppercase;
  color: var(--gold-deep);
  display: inline-flex;
  align-items: center;
  gap: .7em;
  margin-bottom: 1.1em;
  font-weight: 500;
}
.eyebrow::before{
  content:"";
  width: 26px; height: 1px;
  background: var(--gold-deep);
  display:inline-block;
}

.heading-em {color:var(--gold-deep); font-style:italic; font-family:var(--font-accent); font-size:1.2em;}

.bg-navy .eyebrow, .hero .eyebrow, .service-hero .eyebrow{ color: var(--gold-light); }
.bg-navy .eyebrow::before, .hero .eyebrow::before, .service-hero .eyebrow::before{ background: var(--gold-light); }

/* ================= HEADER ================= */
.site-header{
  position: sticky; top:0; z-index: 500;
  background: var(--ivory);
  border-bottom: 1px solid var(--line);
}
.site-header .container{
  display:flex; align-items:center; justify-content:space-between;
  height: 108px;
}
.brand{ display:flex; align-items:flex-end; gap:3px; }
.brand-mark{ height:50px; width:auto; display:block; }
.brand-tld{
  font-family: var(--font-display);
  font-size: 17px; font-weight:700;
  color: var(--gold-deep);
  line-height:1;
  padding-bottom: 3px;
}
.site-footer .brand-tld{ color: var(--gold-light); }
.footer-ca-badge{ height:150px; width:auto; margin-top:20px; }
.header-ca-badge {max-height:40px;}

.main-nav{ display:flex; align-items:center; gap: 6px; }
.main-nav > ul{ display:flex; align-items:center; gap: 2px; }
.main-nav a.nav-link{
  padding: 12px 18px;
  font-family: var(--font-menu);
  font-size: 18px; font-weight:500; color: var(--navy);
  border-radius: var(--radius);
  display:flex; align-items:center; gap:7px;
  letter-spacing: .01em;
}
.main-nav a.nav-link:hover{ color: var(--blue-accent); }
.nav-item{ position:relative; }
.nav-item.has-dropdown > .nav-link .chev{
  width:9px; height:9px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor;
  transform: rotate(45deg); margin-top:-3px; transition: transform .2s ease;
}
.nav-item.has-dropdown:hover > .nav-link .chev{ transform: rotate(225deg); margin-top:3px; }

.dropdown{
  position:absolute; top: 100%; left: 0;
  min-width: 340px;
  background: var(--paper); border-radius: var(--radius);
  border: 1px solid var(--line);
  box-shadow: 0 20px 44px rgba(11,46,89,.14);
  padding: 12px;
  opacity:0; visibility:hidden; transform: translateY(6px);
  transition: all .18s ease;
}
.nav-item.has-dropdown:hover .dropdown,
.nav-item.has-dropdown:focus-within .dropdown{
  opacity:1; visibility:visible; transform: translateY(0);
}
.dropdown a{
  display:flex; align-items:baseline; gap:12px;
  padding: 12px 16px; font-size: 16px; color: var(--ink);
  border-radius: var(--radius);
  font-family: var(--font-menu); font-weight: 500;
}
.dropdown a .code{
  font-family: var(--font-mono); font-size: 11.5px; color: var(--gold-deep);
  flex-shrink:0;
}
.dropdown a:hover{ background: var(--blue-tint); color: var(--blue-accent); }
.dropdown .dd-divider{ border-top:1px solid var(--line-soft); margin: 6px 4px; }

.cta-btn{
  background: var(--navy); color: var(--ivory) !important;
  padding: 13px 24px; font-family: var(--font-display); font-weight:600; font-size:15.5px;
  border-radius: var(--radius); 
  border: 1px solid var(--navy);
  letter-spacing: .01em;
}
.cta-btn:hover{ background: var(--navy-soft); }
.cta-btn.gold{ background: var(--gold); border-color: var(--gold); color: var(--navy-deep) !important; margin-right: 8px;}
.cta-btn.gold:hover{ background: var(--gold-deep); border-color: var(--gold-deep); color: var(--ivory) !important; }

.nav-toggle{ display:none; }

/* ================= FOOTER ================= */
.site-footer{
  background: var(--navy-deep); color: #CBD4DE;
  padding: 74px 0 0;
}
.site-footer a{ color: #CBD4DE; }
.footer-grid{
  display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 44px;
  padding-bottom: 50px;
}
.footer-grid h4{ font-family: var(--font-display); color: var(--gold-light); font-size:16px; letter-spacing:.04em; }
.footer-brand .brand{ margin-bottom: 16px; }
.footer-brand p{ color: #9FAEBD; font-size: 15px; max-width: 320px; }
.footer-grid ul li{ margin-bottom: 11px; font-size: 15px; color:#B7C2CE;}
.footer-grid ul li a:hover{ color: var(--gold-light); }
.footer-office{ font-size: 14.2px; margin-bottom: 22px; color:#9FAEBD; }
.footer-office strong{ display:block; color:#E7EEF6; font-family: var(--font-display); font-size:15.5px; margin-bottom:4px; font-weight:600;}
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.1);
  padding: 22px 0 28px;
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-size: 13.5px; color:#7E8DA0;
}

/* ================= HERO ================= */
.hero{
  position:relative;
  background: linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%);
  background-image:url(../images/home-banner2.png);
    background-size: cover;
    background-repeat:no-repeat;
  color: var(--ivory);
  overflow:hidden; background-position:top left;
}

.hero::before{
  content:""; position:absolute; inset:0;
  background-image: repeating-linear-gradient(to bottom, transparent 0 48px, rgba(247,244,238,.05) 48px 49px);
  pointer-events:none;
}
.hero-inner{
  position:relative; z-index:1;
  padding: 60px 15px 70px;
  display:grid; grid-template-columns: 1.05fr .95fr; gap: 50px; align-items:center;
}
.hero h1{
  color: var(--ivory);
  font-size: 54px; line-height: 1.14; letter-spacing:-0.015em;
  margin-bottom: 26px;
  font-weight: 800;
}
.hero h1 em{ font-style: italic; font-family: var(--font-accent); font-weight:500; color: var(--gold-light); }
.hero p.lead{
  color: #C4D0DD; font-size: 19.5px; max-width: 520px; margin-bottom: 34px; line-height:1.7;
}
.hero .hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }
.hero-art{ position:relative; }
.hero-art img{ width:100%; max-width: 480px; margin: 0 auto; }

.hero-panel{
  background: rgba(247,244,238,.06);
  border: 1px solid rgba(255,170,23,.3);
  padding: 38px;
  border-radius: var(--radius);
}
.hero-panel .ledger-row{
  display:flex; justify-content:space-between; align-items:baseline;
  padding: 18px 0; border-bottom: 1px solid rgba(255,255,255,.12);
}
.hero-panel .ledger-row:last-child{ border-bottom:none; }
.hero-panel .ledger-row .num{
  font-family: var(--font-mono); font-size: 32px; color: var(--gold-light); font-weight:600;
}
.hero-panel .ledger-row .lbl{
  font-size: 14.5px; color:#B9C2C5; text-align:right; max-width:190px;
}

/* stats strip (below hero, full-width) */
.stats-strip{
  background: var(--navy-soft);
  padding: 0;
}
.stats-strip .container{
  display:grid; grid-template-columns: repeat(4,1fr);
}
.stat-cell{
  padding: 40px 30px;
  text-align:center;
  border-right: 1px solid rgba(255,255,255,.12);
}
.stat-cell:last-child{ border-right:none; }
.stat-cell .num{
  font-family: var(--font-display); font-size: 44px; font-weight:600; color: var(--gold-light);
  display:block; margin-bottom: 8px;
}
.stat-cell .lbl{ font-size: 14.5px; color:#C4D0DD; }

/* ================= SECTIONS ================= */
section{ padding: 104px 0; }
.section-tight{ padding: 66px 0; }
.section-head{ max-width: 700px; margin-bottom: 56px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.section-head h2{ font-size: 40px; }
.bg-paper{ background: var(--paper); }
.bg-navy{ background: linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); color: var(--ivory); }
.bg-navy h2, .bg-navy h3{ color: var(--ivory); }
.bg-navy p{ color:#C4D0DD; }

/* about intro */
.about-grid{
  display:grid; grid-template-columns: .9fr 1.1fr; gap:70px; align-items:start;
}
.pillar-list{ display:grid; gap: 26px; margin-top: 10px; }
.pillar{ display:flex; gap:18px; }
.pillar .mark{
  font-family: var(--font-mono); color: var(--gold-deep); font-size:14px; padding-top:4px; flex-shrink:0; width:36px;
}
.pillar h4{ font-size:18.5px; margin-bottom:5px; }
.pillar p{ font-size: 16px; color: var(--ink-soft); margin:0; }











/* service category cards on home */
.services-grid{
  display:grid; grid-template-columns: repeat(4,1fr); gap: 28px;
}
.svc-card{
  background: var(--paper); border:1px solid var(--line); border-radius: var(--radiuslg);
  padding: 34px 28px; transition: border-color .35s ease, transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease;
  box-shadow: 0 6px 20px rgba(11,46,89,0.05);overflow: hidden;
}
.svc-card:hover{
  border-color: var(--gold-pale);
  box-shadow: 0px 60px 60px rgba(0,0,0,0.1);
  -webkit-transform: translate(0, -10px);
 transform: translateY(-10px);
}

.svc-card::before {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--gold), var(--gold-pale));
  opacity: 0;
  transition: opacity var(--transition);
}

.svc-card:hover::before { opacity: 1; }

.service-number {
  font-family: var(--font-serif);
  font-size: 4rem;
  font-weight: 400;
  color: var(--line-soft);
  line-height: 1;
  margin-bottom: 1.25rem;
  transition: color var(--transition);
}

.svc-card:hover .service-number { color: var(--gold-pale); }





.svc-card .code{ font-family: var(--font-mono); color: var(--gold-deep); font-size:13px; letter-spacing:.1em; }
.svc-card h3{ font-size: 20.5px; margin: 12px 0 12px; }
.svc-card p{ font-size: 15.5px; color: var(--ink-soft); margin-bottom: 18px; }
.svc-card .more{ font-size:14.5px; font-weight:700; color:var(--blue-accent); font-family: var(--font-display); }
.svc-card:hover  .more{ color:var(--gold); }

/* service page layout */
.service-hero{
  position:relative;
  background-color: var(--navy);
  background-image: url("../images/header-pattern.svg"), linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%);
  background-repeat: no-repeat; background-position: right center; background-size: cover;
  color: var(--ivory); padding: 84px 0 66px;
}
.service-hero .eyebrow{ color: var(--gold-light); }
.service-hero h1{ color: var(--ivory); font-size:44px; }
.service-hero p{ color:#C4D0DD; max-width:660px; font-size:18px; }

/* Each inner page gets its own banner illustration, same duotone family, different motif */
.service-hero.banner-about        { background-image: url("../images/banner-about.svg"),        linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }
.service-hero.banner-team         { background-image: url("../images/banner-team.svg"),         linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }
.service-hero.banner-audit        { background-image: url("../images/banner-audit.svg"),        linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }
.service-hero.banner-accounting   { background-image: url("../images/banner-accounting.svg"),   linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }
.service-hero.banner-advisory     { background-image: url("../images/banner-advisory.svg"),     linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }
.service-hero.banner-consultancy  { background-image: url("../images/banner-consultancy.svg"),  linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }
.service-hero.banner-contact      { background-image: url("../images/banner-contact.svg"),      linear-gradient(160deg, var(--navy) 0%, var(--navy-deep) 100%); }

.service-layout{
  display:grid; grid-template-columns: 280px 1fr; gap: 60px; align-items:start;
}
.service-toc{
  position: sticky; top: 128px;
  background: var(--paper); border:1px solid var(--line); border-radius: var(--radius);
  padding: 24px;
  box-shadow: 0 6px 20px rgba(11,46,89,0.05);
}
.service-toc .toc-title{
  font-family: var(--font-mono); font-size:12px; letter-spacing:.12em;
  color: var(--ink-soft); text-transform:uppercase; margin-bottom:14px;
}
.service-toc a{
  display:block; padding: 10px 0; font-size: 15px; color: var(--ink);
  border-top: 1px solid var(--line-soft);
  font-weight: 500;
}
.service-toc a:first-of-type{ border-top:none; }
.service-toc a:hover{ color: var(--blue-accent); }

.svc-block{ padding-bottom: 50px; margin-bottom: 50px; border-bottom:1px solid var(--line); scroll-margin-top: 128px; }
.svc-block:last-child{ border-bottom:none; margin-bottom:0; padding-bottom:0; }
.svc-block .code{ font-family: var(--font-mono); color: var(--gold-deep); font-size:13px; }
.svc-block h2{ font-size: 28px; margin-top:8px; }
.svc-block ul.check{ display:grid; gap:12px; margin-top: 20px; }
.svc-block ul.check li{
  display:flex; gap: 14px; font-size: 16px; color: var(--ink);
  padding-left: 0;
}
.svc-block ul.check li::before{
  content:"—"; color: var(--gold-deep); font-weight:700; flex-shrink:0;
}

/* team */


.team-grid{
  display:grid; grid-template-columns: repeat(4,1fr); gap: 30px;
}
.team-card{
  background:var(--paper); border:1px solid var(--line); border-radius: var(--radiuslg); overflow:hidden;
  box-shadow: 0 6px 20px rgba(11,46,89,0.05);
  transition: border-color .35s ease, transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease;
   text-align: center;
  padding: 2.5rem 2rem;

}
.team-card:hover{
  border-color: var(--gold-pale);
  box-shadow: 0px 60px 60px rgba(0,0,0,0.1);
  -webkit-transform: translate(0, -10px);
 transform: translateY(-8px);

}
.team-card .photo{ /*aspect-ratio: 4/5; overflow:hidden; background:var(--line-soft);  */
	position: relative;
   
    margin: 0 auto 1.75rem;
    border-radius:12px;
    overflow: hidden;
    border: 3px solid var(--line);
    background: #f5f5f5;
    transition: border-color var(--transition), box-shadow var(--transition); }
	

.team-card:hover .photo {
  border-color: var(--gold);
  box-shadow: 0 8px 24px rgba(196,154,60,0.15);
}

.team-card .photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top center;
  display: block;
  border-radius: 0;
}


.team-card .info{ padding: 5px 0px; }
.team-card h4{ font-size:17.5px; margin-bottom:5px; }
.team-card .role{ font-family:var(--font-mono); font-size:12px; color:var(--gold-deep); letter-spacing:.05em; text-transform:uppercase; margin-bottom:11px; display:block;}
.team-card p{ font-size:14.5px; color:var(--ink-soft); margin:0; }





.values-strip{
  display:grid; grid-template-columns: repeat(3,1fr); gap:0;
  border: 1px solid var(--line); border-radius: var(--radius); overflow:hidden;
}
.values-strip .value{
  padding: 34px 30px; border-right:1px solid var(--line); background: var(--paper);
  position: relative; z-index: 1;
  transition: transform .35s cubic-bezier(.22,.61,.36,1), box-shadow .35s ease;
}
.values-strip .value:last-child{ border-right:none; }
.values-strip .value:hover{
  box-shadow: 0px 60px 60px rgba(0,0,0,0.1);
  -webkit-transform: translate(0, -10px);
  transform: translate(0, -10px);
}
.values-strip h4{ font-size:18px; }
.values-strip p{ font-size:15.5px; color:var(--ink-soft); margin:0; }

/* contact */
.contact-grid{
  display:grid; grid-template-columns: .9fr 1.1fr; gap: 64px; align-items:start;
}
.office-card{
  padding: 24px 0; border-bottom: 1px solid var(--line);
}
.office-card:first-child{ padding-top:0; }
.office-card h4{ font-size:18px; margin-bottom:9px; }
.office-card p{ font-size:15.5px; margin: 0 0 5px; color: var(--ink-soft); }
.office-card a{ color: var(--blue-accent); font-weight:600; }

/* ---- small inline icons (phone / mail / location) ---- */
.icon-inline{
  width: 15px; height: 15px;
  stroke: currentColor; fill: none;
  stroke-width: 2; stroke-linecap: round; stroke-linejoin: round;
  vertical-align: -2px;
  margin-right: 7px;
  flex-shrink: 0;
  display: inline-block;
}
.office-line{ display:flex; align-items:flex-start; gap:0; }
.office-line .icon-inline{ margin-top: 3px; color: var(--blue-accent); }
.footer-office .office-line{ color:#9FAEBD; }
.footer-office .office-line .icon-inline{ color: var(--gold-light); }

/* ---- team member contact + social row (Our Team page) ---- */
.team-contact{
  margin-top: 14px;
  display: flex;
  flex-direction: column;
  gap: 7px;
  align-items: center;
}
.team-contact a{
  display: inline-flex; align-items: center;
  font-size: 13.8px; color: var(--ink-soft);
  transition: color .2s ease;
}
.team-contact a:hover{ color: var(--blue-accent); }
.team-contact a .icon-inline{ color: var(--gold-deep); margin-right: 6px; }

.team-social{
  margin-top: 16px;
  display: flex; justify-content: center; gap: 12px;
}
.team-social .social-icon{
  width: 34px; height: 34px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 50%;
  border: 1px solid var(--line);
  color: var(--ink-soft);
  transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease;
}
.team-social .social-icon svg{ width: 16px; height: 16px; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.team-social .social-icon:hover{
  color: var(--ivory);
  background: var(--blue-accent);
  border-color: var(--blue-accent);
  transform: translateY(-3px);
}
.team-social .social-icon.linkedin:hover{ background:#0A66C2; border-color:#0A66C2; }
.team-social .social-icon.facebook:hover{ background:#1877F2; border-color:#1877F2; }
.team-social .social-icon.instagram:hover{ background:#D6249F; border-color:#D6249F; }

/* ---- phone field validation (+ country-flag widget width fix) ---- */
.field .iti{ width: 100%; display: block; }
.field-hint{
  display:block; color: var(--ink-soft); font-size: 12.8px; margin-top: 6px;
}
.field-error{
  display:none;
  color:#B3261E; font-size: 13px; margin-top: 6px; font-weight:600;
}
.field-error.show{ display:block; }
.field.has-error input{ border-color:#B3261E; }

.form-panel{
  background: var(--paper); border:1px solid var(--line); border-radius: var(--radius); padding: 46px;
  box-shadow: 0 10px 30px rgba(11,46,89,0.06);
}
.form-row{ display:grid; grid-template-columns: 1fr 1fr; gap:22px; }
.field{ margin-bottom: 22px; }
.field label{
  display:block; font-size:14px; font-weight:600; color:var(--navy);
  margin-bottom: 8px; letter-spacing:.02em; font-family: var(--font-display);
}
.field input, .field select, .field textarea{
  width:100%; padding: 13px 15px; font-family: var(--font-body); font-size:16px;
  border:1px solid var(--line); background: #fff; color: var(--ink);
  border-radius: var(--radius);
}
.field input:focus, .field select:focus, .field textarea:focus{
  outline:none; border-color: var(--gold);
}
.field textarea{ resize: vertical; min-height: 130px; }
.field .req{ color:var(--gold-deep); }
.submit-btn{
  background: var(--navy); color:var(--ivory); border:none; padding: 15px 34px;
  font-family: var(--font-display); font-size:16px; font-weight:700; cursor:pointer; border-radius: var(--radius);
}
.submit-btn:hover{ background: var(--gold); }
.form-note{ font-size:13.5px; color: var(--ink-soft); margin-top:16px; }
.form-success{
  display:none; background:#EAF3E9; border:1px solid #9EBF9B; color:#2A5A32;
  padding:18px 22px; font-size:15.5px; margin-bottom:22px; border-radius: var(--radius);
}
.form-success.show{ display:block; }

/* CTA band */
.cta-band{
  background: var(--line-soft); color: var(--navy-deep);
  text-align:center; padding: 70px 0;
}
.cta-band h2{ color: var(--navy-deep); font-size:34px; }
.cta-band p{ color:#3A3018; max-width:580px; margin:0 auto 30px; font-size:17.5px; }
.cta-band .cta-btn{ background:var(--navy-deep); color:var(--ivory) !important; border-color:var(--navy-deep); }
.cta-band .cta-btn:hover{ background: var(--gold);border-color:var(--gold); color:var(--ivory); }

/* breadcrumb */
.breadcrumb{ font-family: var(--font-mono); font-size:12.5px; letter-spacing:.05em; color:#8FA3B8; margin-bottom:20px; }
.breadcrumb a{ color:#C4D0DD; }
.breadcrumb a:hover{ color: var(--gold-light); }

/* Who we are page extra */
.quote-block{
  border-left: 3px solid var(--gold);
  padding: 8px 0 8px 28px;
  margin: 12px 0 34px;
}
.quote-block p{ font-family: var(--font-accent); font-size:24px; font-style:italic; font-weight:500; color:var(--navy); margin:0; line-height:1.55;}

/* ================= RESPONSIVE ================= */
@media (max-width: 980px){
  body{ font-size:17.5px; }
  .hero h1{ font-size:42px; }
  .services-grid{ grid-template-columns: repeat(2,1fr); }
  .about-grid, .contact-grid{ grid-template-columns: 1fr; gap:40px; }
  .hero-inner{ grid-template-columns: 1fr; padding: 80px 15px 60px; }
  .hero-art{ order:-1; max-width:360px; margin:0 auto 20px; }
  .stats-strip .container{ grid-template-columns: repeat(2,1fr); }
  .stat-cell:nth-child(2){ border-right:none; }
  .team-grid{ grid-template-columns: repeat(2,1fr); }
  .values-strip{ grid-template-columns: 1fr; }
  .values-strip .value{ border-right:none; border-bottom:1px solid var(--line); }
  .service-layout{ grid-template-columns: 1fr; }
  .service-toc{ position:static; }
  .footer-grid{ grid-template-columns: 1fr 1fr; }
  .header-ca-badge { display:none }
}
@media (max-width: 720px){
	 .header-ca-badge { display:none }
  .main-nav{
    position: fixed; inset: 108px 0 0 0; background: var(--ivory);
    flex-direction:column; align-items:stretch; padding: 22px;
    transform: translateX(100%); transition: transform .25s ease;
    overflow-y:auto;
  }
  .main-nav.open{ transform: translateX(0); }
  .main-nav > ul{ flex-direction:column; align-items:stretch; gap:0; }
  .nav-item{ border-bottom:1px solid var(--line-soft); }
  .dropdown{
    position:static; opacity:1; visibility:visible; transform:none;
    display:none; border:none; box-shadow:none; background:transparent; padding:0 0 10px 14px;
  }
  .nav-item.dd-open .dropdown{ display:block; }
  .nav-toggle{
    display:flex; flex-direction:column; gap:5px; width:36px; cursor:pointer; background:none; border:none; padding:0;
  }
  .nav-toggle span{ height:2.5px; background:var(--navy); border-radius:2px; }
  .cta-btn.gold{ margin: 16px 0 0; text-align:center; }
  .services-grid{ grid-template-columns: 1fr; }
  .team-grid{ grid-template-columns: 1fr 1fr; }
  .stats-strip .container{ grid-template-columns: 1fr 1fr; }
  .stat-cell{ border-bottom:1px solid rgba(255,255,255,.12); }
  .hero h1{ font-size:34px; }
  section{ padding: 76px 0; }
  .form-row{ grid-template-columns: 1fr; }
  .footer-grid{ grid-template-columns: 1fr; }
}

/* ================= SCROLL-REVEAL ANIMATION ================= */
@keyframes fadeInUp{
  from{ opacity:0; transform: translateY(34px); }
  to{ opacity:1; transform: translateY(0); }
}
.reveal{
  opacity:0;
  transform: translateY(34px);
  transition: opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1);
  will-change: opacity, transform;
}
.reveal.in-view{
  opacity:1;
  transform: translateY(0);
}

/* ================= BACK TO TOP BUTTON ================= */
.back-to-top{
  position: fixed;
  right: 28px;
  bottom: 28px;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background: var(--gold);
  border: none;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor: pointer;
  z-index: 700;
  box-shadow: 0 10px 26px rgba(11,46,89,.28);
  opacity: 0;
  visibility: hidden;
  transform: translateY(24px) scale(.75);
  transition: opacity .35s ease, visibility .35s ease, transform .4s cubic-bezier(.34,1.56,.64,1), background .25s ease, box-shadow .25s ease;
}
.back-to-top.show{
  opacity: 1;
  visibility: visible;
  transform: translateY(0) scale(1);
}
.back-to-top:hover{
  background: var(--gold-deep);
  box-shadow: 0 16px 34px rgba(11,46,89,.34);
  transform: translateY(-6px) scale(1.06);
}
.back-to-top .arrow{
  width: 13px;
  height: 13px;
  border-right: 3px solid var(--navy-deep);
  border-top: 3px solid var(--navy-deep);
  transform: rotate(-45deg);
  margin-top: 5px;
  animation: bob 1.7s ease-in-out infinite;
}

/********************************************/


.iti__search-input, .iti__country {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}
.iti__search-input {
    width: 100% !important;
    border-width: 0 !important;
    border-radius: 3px !important;
    padding-left: calc(var(--iti-spacer-horizontal) + var(--iti-globe-icon-size) + var(--iti-spacer-horizontal)) !important;
    padding-right: calc(var(--iti-spacer-horizontal) + var(--iti-clear-icon-size) + var(--iti-spacer-horizontal)) !important;
}
input#phone {font-size:18px;}
input#phone::placeholder {
    color: #cccccc; font-size:18px
}

.whatsapp-link{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px; height: 52px;
  border-radius: 50%;
  background: #25D366;
  color: #FFFFFF;
  margin-top: 8px;
  transition: background .2s ease, transform .2s ease;
}
.whatsapp-link svg{ width: 40px; height: 40px; fill: currentColor; }
.whatsapp-link:hover{ background: #1EBE5A; transform: translateY(-2px); }

@keyframes bob{
  0%, 100%{ transform: rotate(-45deg) translate(0,0); }
  50%{ transform: rotate(-45deg) translate(4px,-4px); }
}

@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
  .back-to-top .arrow{ animation:none; }
  .back-to-top, .svc-card, .team-card, .values-strip .value{ transition:none; }
  html{ scroll-behavior:auto; }
}
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(30px); }
  to   { opacity: 1; transform: translateY(0); }
}

@keyframes fadeIn {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.anim-fade-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.75s var(--ease-out), transform 0.75s var(--ease-out);
}

.anim-fade-up.in-view {
  opacity: 1;
  transform: translateY(0);
}