@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,400;0,9..144,500;0,9..144,600;0,9..144,700;0,9..144,900;1,9..144,500&family=Karla:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');
:root{
  --bg:#F6F3EC;--bg-alt:#EFEADD;--surface:#FFFDF8;--surface-2:#FBF7EE;
  --border:#E1DAC5;--border-strong:#CFC5A8;
  --text:#12201D;--text-muted:#4C5A54;--text-faint:#7C887F;
  --brand:#1B3A34;--brand-2:#234840;--brand-contrast:#F6F3EC;
  --accent:#DF9528;--accent-hover:#C17F1C;--accent-contrast:#16110A;
  --accent-soft:rgba(223,149,40,.14);--shadow-color:148,108,34;
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Karla','Segoe UI',system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono','SFMono-Regular',Consolas,monospace;
  --radius:12px;--radius-sm:8px;--container:1220px;--ease:cubic-bezier(.22,.8,.32,1);
}
body{background:var(--bg);color:var(--text);margin:0;font-family:var(--font-body);}

/* ZaMa Services landing template — realizes the active "ZaMa Signal" design. */

:where(html){ box-sizing:border-box; }
:where(*,*::before,*::after){ box-sizing:inherit; }

.zama-doc{
  --bg:#F6F3EC; --bg-alt:#EFEADD; --surface:#FFFDF8; --surface-2:#FBF7EE;
  --border:#E1DAC5; --border-strong:#CFC5A8;
  --text:#12201D; --text-muted:#4C5A54; --text-faint:#7C887F;
  --brand:#1B3A34; --brand-2:#234840; --brand-contrast:#F6F3EC;
  --accent:#DF9528; --accent-hover:#C17F1C; --accent-contrast:#16110A;
  --accent-soft:rgba(223,149,40,.14); --shadow-color:148,108,34;
  --font-display:'Fraunces',Georgia,'Times New Roman',serif;
  --font-body:'Karla','Segoe UI',system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono','SFMono-Regular',Consolas,monospace;
  --radius:12px; --radius-sm:8px; --container:1220px; --ease:cubic-bezier(.22,.8,.32,1);

  background:var(--bg); color:var(--text); font-family:var(--font-body);
  font-size:16px; line-height:1.6; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
.zama-doc :where(h1,h2,h3,h4){ margin:0; font-family:var(--font-display); font-weight:600; letter-spacing:-.01em; }
.zama-doc :where(p){ margin:0; }
.zama-doc :where(a){ color:inherit; }
.zama-doc :where(ul){ margin:0; padding:0; list-style:none; }
.zama-doc img,.zama-doc svg{ max-width:100%; display:block; }
.zama-doc :focus-visible{ outline:2px solid var(--accent); outline-offset:3px; border-radius:4px; }

.zama-container{ max-width:var(--container); margin-inline:auto; padding-inline:clamp(1.25rem,4vw,3rem); }
.zama-eyebrow{
  font-family:var(--font-mono); font-size:.72rem; font-weight:600; text-transform:uppercase;
  letter-spacing:.14em; color:var(--accent-hover); display:inline-flex; align-items:center; gap:.6em;
}
.zama-eyebrow::before{ content:''; width:1.4em; height:1px; background:currentColor; display:inline-block; }
.zama-lead{ font-size:clamp(1.05rem,.95rem + .5vw,1.3rem); color:var(--text-muted); max-width:52ch; }
.zama-section{ padding-block:4.5rem; border-bottom:1px solid var(--border); }
.zama-section-alt{ background:var(--bg-alt); }
.zama-section-head{ max-width:62ch; display:flex; flex-direction:column; gap:1rem; margin-bottom:3rem; }

.zama-btn{
  display:inline-flex; align-items:center; gap:.55em; white-space:nowrap; font-weight:700; font-size:.95rem;
  padding:.85em 1.5em; border-radius:9px; border:1px solid transparent; cursor:pointer; text-decoration:none;
  transition:transform .18s var(--ease), background .18s var(--ease), border-color .18s var(--ease);
}
.zama-btn:active{ transform:translateY(1px); }
.zama-btn-primary{ background:var(--accent); color:var(--accent-contrast); }
.zama-btn-primary:hover{ background:var(--accent-hover); }
.zama-btn-ghost{ background:transparent; border-color:var(--border-strong); color:var(--text); }
.zama-btn-ghost:hover{ border-color:var(--accent); color:var(--accent-hover); }
.zama-btn-on-brand{ background:var(--accent); color:var(--accent-contrast); }
.zama-btn-ghost-on-brand{ background:transparent; border-color:rgba(246,243,236,.35); color:var(--brand-contrast); }
.zama-btn svg{ width:1em; height:1em; }

/* header */
.zama-header{
  position:sticky; top:0; z-index:100; background:rgba(246,243,236,.9); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--border);
}
.zama-header-inner{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding-block:1.05rem; }
.zama-brand{ display:flex; align-items:center; gap:.6rem; text-decoration:none; }
.zama-brand-mark{ width:34px; height:34px; color:var(--brand); flex:none; }
.zama-brand-word{ display:flex; flex-direction:column; line-height:1; }
.zama-brand-word b{ font-family:var(--font-display); font-size:1.28rem; font-weight:700; }
.zama-brand-word span{ font-family:var(--font-mono); font-size:.62rem; letter-spacing:.16em; text-transform:uppercase; color:var(--text-faint); margin-top:.25em; }
.zama-nav-desktop{ display:flex; align-items:center; gap:2rem; }
.zama-nav-links{ display:flex; align-items:center; gap:1.5rem; }
.zama-nav-links a{ text-decoration:none; font-weight:600; font-size:.94rem; color:var(--text-muted); }
.zama-nav-links a:hover{ color:var(--text); }
.zama-nav-links a[aria-current='page']{ color:var(--text); border-bottom:2px solid var(--accent); padding-bottom:2px; }
.zama-header-actions{ display:flex; align-items:center; gap:1rem; }
.zama-menu-toggle{ display:none; align-items:center; justify-content:center; width:42px; height:42px; border-radius:9px; border:1px solid var(--border-strong); background:transparent; cursor:pointer; }
.zama-menu-toggle svg{ width:20px; height:20px; }
.zama-menu-toggle .zama-icon-close{ display:none; }
.zama-menu-toggle[aria-expanded='true'] .zama-icon-open{ display:none; }
.zama-menu-toggle[aria-expanded='true'] .zama-icon-close{ display:block; }
.zama-mobile-panel{
  position:fixed; inset:0 0 0 auto; width:min(320px,86vw); height:100dvh; z-index:110; background:var(--surface);
  border-left:1px solid var(--border); transform:translateX(100%); transition:transform .3s var(--ease);
  display:flex; flex-direction:column; padding:1.5rem; overflow-y:auto;
}
.zama-mobile-panel.is-open{ transform:translateX(0); }
.zama-mobile-scrim{ position:fixed; inset:0; z-index:109; background:rgba(10,16,14,.4); opacity:0; pointer-events:none; transition:opacity .3s var(--ease); }
.zama-mobile-scrim.is-open{ opacity:1; pointer-events:auto; }
.zama-mobile-panel .zama-nav-links{ flex-direction:column; align-items:flex-start; gap:1rem; margin-top:2rem; }
.zama-mobile-panel .zama-nav-links a{ font-size:1.15rem; }
.zama-mobile-panel .zama-header-actions{ margin-top:2rem; flex-direction:column; align-items:stretch; }
@media (max-width:880px){ .zama-nav-desktop{ display:none; } .zama-menu-toggle{ display:inline-flex; } .zama-header-actions > .zama-btn-primary{ display:none; } }

/* hero */
.zama-hero{ position:relative; overflow:hidden; padding-block:5rem 4rem; border-bottom:1px solid var(--border); }
.zama-hero::before{
  content:''; position:absolute; inset:0; z-index:0; opacity:.55;
  background-image:radial-gradient(circle,var(--border-strong) 1px,transparent 1px); background-size:26px 26px;
  mask-image:linear-gradient(to bottom,black,transparent 78%);
}
.zama-hero-grid{ position:relative; z-index:1; display:grid; grid-template-columns:1.1fr .9fr; gap:3rem; align-items:center; }
.zama-hero-copy{ display:flex; flex-direction:column; gap:1.5rem; align-items:flex-start; }
.zama-hero h1{ font-size:clamp(2.35rem,1.3rem + 4.6vw,4.2rem); line-height:1.04; text-wrap:balance; }
.zama-hero h1 em{ font-style:italic; color:var(--accent-hover); font-weight:500; }
.wp-block-group.zama-hero-ctas{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:.5rem !important; }
.zama-beacon{ width:100%; max-width:440px; margin-inline:auto; }
.zama-beacon-pulse{ animation:zama-pulse 3.6s ease-in-out infinite; transform-origin:240px 240px; }
.zama-beacon-pulse.delay{ animation-delay:1.2s; }
@keyframes zama-pulse{ 0%{opacity:.55;transform:scale(1);} 50%{opacity:.05;transform:scale(1.08);} 100%{opacity:.55;transform:scale(1);} }
.zama-beacon-node{ animation:zama-float 5s ease-in-out infinite; transform-origin:center; }
@keyframes zama-float{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-4px);} }
@media (prefers-reduced-motion:reduce){ .zama-beacon-pulse,.zama-beacon-node{ animation:none !important; } }
@media (max-width:640px){ .zama-hero-grid{ grid-template-columns:1.3fr .8fr; gap:1.25rem; } .zama-hero-art{ max-width:clamp(90px,32vw,220px); margin-inline:0; } }
@media (max-width:480px){ .zama-hero-grid{ grid-template-columns:1fr; gap:1.75rem; } .zama-hero-art{ max-width:200px; margin-inline:auto; } .zama-hero-copy{ align-items:flex-start; text-align:left; } }

/* trust strip */
.zama-trust{ border-bottom:1px solid var(--border); background:var(--surface-2); }
.zama-trust-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; padding-block:2rem; }
.zama-trust-item .num{ font-family:var(--font-mono); font-weight:600; color:var(--accent-hover); font-size:.78rem; letter-spacing:.06em; display:block; margin-bottom:.35rem; }
.zama-trust-item p{ font-weight:600; font-size:.95rem; }
@media (max-width:760px){ .zama-trust-grid{ grid-template-columns:repeat(2,1fr); } }

/* grids + cards */
.zama-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:2rem; }
@media (max-width:980px){ .zama-grid-3{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:640px){ .zama-grid-3{ grid-template-columns:1fr; } }
.wp-block-group.zama-services-cta{ display:flex; justify-content:center; margin-top:3rem !important; }
.zama-card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:2rem; display:flex; flex-direction:column; gap:1rem; position:relative; transition:transform .22s var(--ease), box-shadow .22s var(--ease); }
.zama-card:hover{ transform:translateY(-4px); box-shadow:0 20px 34px -22px rgba(var(--shadow-color),.45); }
.zama-card::before,.zama-card::after{ content:''; position:absolute; width:16px; height:16px; border:1.5px solid var(--accent); opacity:0; transition:opacity .25s var(--ease); }
.zama-card::before{ top:8px; left:8px; border-right:none; border-bottom:none; }
.zama-card::after{ bottom:8px; right:8px; border-left:none; border-top:none; }
.zama-card:hover::before,.zama-card:hover::after{ opacity:1; }
.zama-card-icon{ width:44px; height:44px; color:var(--accent-hover); }
.zama-card h3{ font-size:1.2rem; }
.zama-card p{ color:var(--text-muted); font-size:.96rem; }
.zama-benefit{ display:flex; flex-direction:column; gap:.75rem; padding-top:1.5rem; border-top:2px solid var(--border-strong); }
.zama-benefit .idx{ font-family:var(--font-mono); font-size:.75rem; color:var(--text-faint); letter-spacing:.1em; }
.zama-benefit p{ color:var(--text-muted); font-size:.96rem; }

/* testimonials */
.zama-testimonial{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); padding:2rem; display:flex; flex-direction:column; gap:1.5rem; height:100%; }
.zama-testimonial blockquote{ margin:0; font-family:var(--font-display); font-size:1.1rem; line-height:1.5; font-weight:500; }
.wp-block-group.zama-t-person{ display:flex; align-items:center; gap:.8rem; margin-top:auto !important; }
.zama-t-avatar{ width:44px; height:44px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--brand); color:var(--brand-contrast); font-family:var(--font-mono); font-weight:600; font-size:.85rem; flex:none; }
.zama-t-person strong{ display:block; font-size:.92rem; }
.zama-t-person span{ display:block; font-size:.8rem; color:var(--text-faint); }

/* about preview */
.zama-about-hero{ display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:center; }
@media (max-width:900px){ .zama-about-hero{ grid-template-columns:1fr; } }
.zama-quote-block{ background:var(--brand); color:var(--brand-contrast); border-radius:16px; padding:2.5rem; font-family:var(--font-display); font-size:clamp(1.3rem,1.05rem + .9vw,1.7rem); font-weight:500; line-height:1.35; }
.zama-quote-block span{ display:block; margin-top:1.5rem; font-family:var(--font-mono); font-size:.75rem; letter-spacing:.1em; color:rgba(246,243,236,.65); }

/* cta banner */
.zama-cta-banner{ background:var(--brand); color:var(--brand-contrast); border-radius:20px; padding:3rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:2rem; position:relative; overflow:hidden; }
.zama-cta-banner h2{ color:var(--brand-contrast); font-size:clamp(1.9rem,1.2rem + 2.8vw,3rem); max-width:16ch; }
.zama-cta-banner p{ color:rgba(246,243,236,.75); max-width:42ch; margin-top:.6rem; }
.zama-cta-actions{ display:flex; gap:1rem; flex-wrap:wrap; background:#1B3A34; padding:1px; }

/* footer */
.zama-footer{ background:var(--brand); color:var(--brand-contrast); }
.zama-footer-grid{ display:grid; grid-template-columns:1.3fr 1fr; gap:3rem; padding-block:4rem; }
@media (max-width:560px){ .zama-footer-grid{ grid-template-columns:1fr; } }
.zama-footer-brand{ display:flex; align-items:center; gap:.6rem; margin-bottom:1rem; text-decoration:none; }
.zama-footer-brand svg{ width:30px; height:30px; color:var(--accent); }
.zama-footer-brand b{ font-family:var(--font-display); font-size:1.15rem; color:var(--brand-contrast); }
.zama-footer p{ color:rgba(246,243,236,.65); font-size:.9rem; max-width:34ch; }
.zama-footer-h{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.12em; text-transform:uppercase; color:rgba(246,243,236,.5); margin-bottom:1rem; }
.zama-footer-links{ display:flex; flex-direction:column; gap:.75rem; }
.zama-footer-links a{ color:rgba(246,243,236,.82); text-decoration:none; font-size:.92rem; }
.zama-footer-links a:hover{ color:var(--accent); }
.zama-footer-bottom{ border-top:1px solid rgba(246,243,236,.14); padding-block:1.5rem; display:flex; flex-wrap:wrap; gap:1rem; align-items:center; justify-content:space-between; }
.zama-footer-bottom p{ color:rgba(246,243,236,.55); font-size:.82rem; }

[data-zama-reveal]{ opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease), transform .6s var(--ease); }
.zama-js [data-zama-reveal].in-view{ opacity:1; transform:translateY(0); }
.zama-no-js [data-zama-reveal]{ opacity:1; transform:none; }

.zama-btn-arrow::after{
  content:"";
  display:inline-block;
  width:20px; height:20px;
  background-color:currentColor;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M4 10h12M11 5l5 5-5 5' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Cpath d='M4 10h12M11 5l5 5-5 5' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat;
  -webkit-mask-position:center; mask-position:center;
}

/* Native zama/button and core/group blocks replace the old per-instance
   core/html buttons; no wrapping div issue since zama/button renders a bare
   <a>, but keep buttons block-editor-friendly by neutralising any stray
   wp-block-button wrapper in case one is ever used here too. */
.wp-block-buttons .wp-block-button{ display:contents; }
/* language switcher */
.zama-lang-switch{ display:flex; align-items:center; gap:.35rem; margin-right:.5rem; font-family:var(--font-mono); font-size:.72rem; letter-spacing:.06em; }
.zama-lang-link{ color:var(--text-muted); text-decoration:none; padding:.3rem .5rem; border-radius:6px; transition:color .15s var(--ease),background .15s var(--ease); }
.zama-lang-link:hover{ color:var(--text); background:var(--surface-2); }
.zama-lang-link.is-active{ color:var(--accent-hover); font-weight:700; }
.zama-lang-switch-mobile{ display:flex; gap:.5rem; margin-top:.5rem; font-family:var(--font-mono); font-size:.8rem; }

/* contact form */
.zama-form{ display:flex; flex-direction:column; gap:1.25rem; max-width:560px; }
.zama-field{ display:flex; flex-direction:column; gap:.5rem; }
.zama-field label{ font-family:var(--font-mono); font-size:.75rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--text-muted); }
.zama-field input,.zama-field textarea{ font-family:var(--font-body); font-size:1rem; color:var(--text); background:var(--surface); border:1px solid var(--border-strong); border-radius:var(--radius-sm); padding:.85em 1em; resize:vertical; transition:border-color .18s var(--ease),box-shadow .18s var(--ease); }
.zama-field input:focus,.zama-field textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.zama-form-hp{ position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.zama-form .zama-btn{ align-self:flex-start; }
.zama-form-status{ margin:0; font-size:.92rem; font-weight:600; min-height:1.3em; }
.zama-form-status.is-success{ color:var(--brand-2); }
.zama-form-status.is-error{ color:#B3421E; }

/* feature list (services page) */
.zama-feature-list{ display:flex; flex-direction:column; gap:.85rem; }
.zama-feature-list li{ display:flex; align-items:flex-start; gap:.7rem; font-size:.96rem; color:var(--text-muted); }
.zama-feature-list li::before{
  content:""; flex:none; width:1.2em; height:1.2em; margin-top:.15em;
  background-color:var(--accent-hover);
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='10' cy='10' r='8' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M6.5 10l2.3 2.3L14 7.5' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Ccircle cx='10' cy='10' r='8' stroke='%23000' stroke-width='1.5'/%3E%3Cpath d='M6.5 10l2.3 2.3L14 7.5' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:center; mask-position:center; -webkit-mask-size:contain; mask-size:contain;
}
.zama-doc .zama-feature-list li{ list-style:none; margin:0; }

/* portfolio card meta tag */
.zama-card-meta{ display:inline-flex; align-items:center; font-family:var(--font-mono); font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--accent-hover); }

/* two-column content row (about/services intros) */
.zama-split{ display:grid; grid-template-columns:1fr 1fr; gap:3rem; align-items:start; }
@media (max-width:900px){ .zama-split{ grid-template-columns:1fr; } }