/*
Theme Name: DarichaschoolTheme
Theme URI: https://darichaschool.com
Author: Darichaschool
Author URI: https://darichaschool.com
Description: Custom one-page theme for Darichaschool — Afghan Girls' Education, Carried From Afar. Converted from static HTML.
Version: 1.2.1
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: darichaschool
*/

  :root{
    --night:#00A79D;
    --night-2:#076156;
    --lapis:#00A79D;
    --lapis-light:#6BDCD1;
    --saffron:#E7A93E;
    --pomegranate:#C9584A;
    --paper:#EEF1F6;
    --paper-2:#E3E8F0;
    --ink:#141B2B;
    --ink-soft:#4B5670;
    --ink-teal:#052A24;
    --ink-teal-soft:#0E4A40;
    --line:rgba(20,27,43,0.12);
    --line-dark:rgba(5,42,36,0.18);
    --radius:14px;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Manrope',sans-serif;
    background:var(--paper);
    color:var(--ink);
    line-height:1.55;
    -webkit-font-smoothing:antialiased;
  }
  @media (prefers-reduced-motion: reduce){
    html{scroll-behavior:auto;}
    *{animation-duration:0.01ms !important; animation-iteration-count:1 !important; transition-duration:0.01ms !important;}
  }
  h1,h2,h3,.display{ font-family:'Fraunces',serif; letter-spacing:-0.01em; }
  .eyebrow{
    font-family:'IBM Plex Mono',monospace;
    font-size:0.72rem;
    letter-spacing:0.14em;
    text-transform:uppercase;
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  a{color:inherit;text-decoration:none;}
  img,svg{display:block;max-width:100%;}
  .container{ width:100%; max-width:1180px; margin:0 auto; padding:0 28px; }
  section{ position:relative; }
  .visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);}

  /* focus visibility */
  a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible{
    outline:2px solid var(--saffron);
    outline-offset:3px;
    border-radius:4px;
  }

  /* ---------- Star mark (signature element) ---------- */
  .star-mark{ display:block; }

  /* ---------- NAV ---------- */
  header.site-nav{
    position:sticky; top:0; z-index:100;
    background:rgba(0,167,157,0.94);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line-dark);
  }
  .nav-inner{
    display:flex; align-items:center; justify-content:space-between;
    padding:16px 28px; max-width:1180px; margin:0 auto;
  }
  .brand{ display:flex; align-items:center; gap:10px; color:var(--ink-teal); }
  .brand-name{ font-family:'Fraunces',serif; font-size:1.15rem; font-weight:600; }
  .brand-name span{ color:var(--ink-teal); opacity:0.62; }
  nav.links{ display:flex; gap:30px; align-items:center; }
  nav.links a{
    color:var(--ink-teal); font-size:0.92rem; font-weight:600;
    position:relative; padding:6px 20px;
  }
  nav.links a:hover{ color:#04211D; }
  nav.links a::after{
    content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
    background:var(--ink-teal); transition:width .25s ease;
  }
  nav.links a:hover::after{ width:100%; }
  .nav-cta{
    background:var(--ink-teal); color:#EAFBF8 !important; font-weight:700 !important;
    padding:9px 18px; border-radius:100px; font-size:0.85rem !important;
  }
  .nav-cta::after{ display:none; }
  .nav-cta:hover{ filter:brightness(1.3); }
  .lang-switch{
    font-family:'IBM Plex Mono',monospace !important; font-size:0.8rem !important;
    padding:6px 12px; border:1px solid rgba(5,42,36,0.3); border-radius:100px;
  }
  .lang-switch:hover{ background:rgba(5,42,36,0.08); }
 


  /* ---------- HERO ---------- */
  .hero{
    background:var(--night);
    color:var(--ink-teal); overflow:hidden; padding:64px 0 74px;
  }
  .hero-inner{
    display:grid; grid-template-columns:1.05fr 0.8fr; gap:40px; align-items:center;
    padding-top:56px;
  }
  .hero-pattern{ position:absolute; inset:0; opacity:0.1; pointer-events:none; }
  .hero-badge{
    display:inline-flex; align-items:center; gap:9px;
    background:var(--ink-teal); border:1px solid rgba(0,0,0,0.15);
    padding:8px 16px 8px 8px; border-radius:100px; margin-bottom:26px;
  }
  .hero-badge .dot{
    width:8px; height:8px; border-radius:50%; background:var(--lapis-light);
    box-shadow:0 0 0 0 rgba(107,220,209,0.6); animation:pulse 2.2s infinite;
  }
  @keyframes pulse{
    0%{ box-shadow:0 0 0 0 rgba(107,220,209,0.55); }
    70%{ box-shadow:0 0 0 8px rgba(107,220,209,0); }
    100%{ box-shadow:0 0 0 0 rgba(107,220,209,0); }
  }
  .hero-badge span{
    font-family:'IBM Plex Mono',monospace; font-size:0.74rem; letter-spacing:0.04em; color:#D3F3EF;
  }
  .hero-eyebrow{ color:var(--ink-teal); }
  .hero h1{
    font-size:clamp(2.4rem, 4.6vw, 3.9rem);
    font-weight:500;
    line-height:1.06;
    margin:0 0 24px;
    max-width:15ch;
    color:var(--ink-teal);
  }
  .hero h1 .accent{ font-style:italic; text-decoration:underline; text-decoration-color:var(--saffron); text-decoration-thickness:3px; text-underline-offset:6px; }
  .hero p.lead{
    font-size:1.1rem; color:var(--ink-teal-soft); max-width:44ch; margin-bottom:36px; font-weight:500;
  }
  .btn-row{ display:flex; gap:16px; flex-wrap:wrap; align-items:center; }
  .btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:15px 28px; border-radius:100px; font-weight:700; font-size:0.95rem;
    border:1px solid transparent; cursor:pointer; transition:all .2s ease;
  }
  .btn-primary{ background:var(--saffron); color:#1A1206; box-shadow:0 14px 30px -14px rgba(0,0,0,0.45); }
  .btn-primary:hover{ filter:brightness(1.08); transform:translateY(-2px); box-shadow:0 18px 36px -14px rgba(0,0,0,0.5); }
  .btn-ghost{ background:transparent; color:var(--ink-teal); border-color:rgba(5,42,36,0.4); }
  .btn-ghost:hover{ border-color:var(--ink-teal); background:rgba(5,42,36,0.08); }

  .hero-trust{ display:flex; align-items:center; gap:12px; margin-top:32px; }
  .avatar-stack{ display:flex; }
  .avatar-stack span{
    width:30px; height:30px; border-radius:50%; border:2px solid var(--night);
    display:flex; align-items:center; justify-content:center;
    font-family:'IBM Plex Mono',monospace; font-size:0.62rem; font-weight:600; color:#04211D;
    margin-left:-9px;
  }
  .avatar-stack span:first-child{ margin-left:0; }
  .hero-trust p{ font-size:0.84rem; color:var(--ink-teal-soft); font-weight:600; }
  .hero-trust strong{ color:var(--ink-teal); }

  .hero-visual{
    position:relative; aspect-ratio:1; width:100%; max-width:420px; margin:0 auto;
  }
  .hero-glow{
    position:absolute; inset:6%; border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,0.35) 0%, rgba(255,255,255,0) 70%);
    filter:blur(6px);
  }
  .hero-visual svg{ width:100%; height:100%; position:relative; }
  .hero-float-card{
    position:absolute; background:var(--ink-teal); border:1px solid rgba(0,0,0,0.2);
    border-radius:12px; padding:12px 16px;
    display:flex; align-items:center; gap:10px; box-shadow:0 16px 34px -16px rgba(0,0,0,0.5);
    animation:float 5s ease-in-out infinite;
  }
  .hero-float-card.card-1{ top:6%; left:-8%; }
  .hero-float-card.card-2{ bottom:8%; right:-10%; animation-delay:1.4s; }
  @keyframes float{
    0%, 100%{ transform:translateY(0); }
    50%{ transform:translateY(-10px); }
  }
  .hero-float-card .fc-dot{ width:8px; height:8px; border-radius:50%; background:#F0665A; flex-shrink:0; }
  .hero-float-card .fc-icon{
    width:30px; height:30px; border-radius:8px; background:var(--lapis-light);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .hero-float-card b{ display:block; font-size:0.82rem; color:#fff; font-weight:600; }
  .hero-float-card span{ font-size:0.72rem; color:#8FCFC7; font-family:'IBM Plex Mono',monospace; }

  .stat-strip{
    margin-top:64px; display:grid; grid-template-columns:repeat(4,1fr);
    border-top:1px solid rgba(5,42,36,0.2); padding-top:30px; gap:20px;
  }
  .stat b{
    font-family:'Fraunces',serif; font-size:clamp(1.6rem,2.6vw,2.2rem); font-weight:600;
    color:var(--ink-teal); display:block;
  }
  .stat span{
    font-family:'IBM Plex Mono',monospace; font-size:0.7rem; letter-spacing:0.08em;
    text-transform:uppercase; color:var(--ink-teal-soft);
  }
  @media (max-width:860px){
    .hero-inner{ grid-template-columns:1fr; padding-top:0; }
    .hero-visual{ order:-1; max-width:260px; margin-bottom:20px; }
    .hero-float-card{ display:none; }
    .stat-strip{ grid-template-columns:repeat(2,1fr); row-gap:26px; }
  }
  @media (prefers-reduced-motion: reduce){
    .hero-float-card{ animation:none; }
    .hero-badge .dot{ animation:none; }
  }

  /* ---------- SECTION HEADERS ---------- */
  .section-head{ max-width:640px; margin-bottom:48px; }
  .section-head .eyebrow{ color:var(--lapis); margin-bottom:14px; }
  .section-head h2{ font-size:clamp(1.7rem,3vw,2.5rem); font-weight:500; line-height:1.15; }
  .on-dark .section-head .eyebrow{ color:var(--ink-teal); opacity:0.7; }
  .on-dark .section-head h2{ color:var(--ink-teal); }

  /* divider ornament */
  .star-divider{
    display:flex; align-items:center; justify-content:center; gap:14px;
    padding:6px 0 62px;
  }
  .star-divider .line{ height:1px; width:80px; background:var(--line); }
  .on-dark .star-divider .line{ background:var(--line-dark); }

  /* ---------- MISSION ---------- */
  .mission{ padding:100px 0 40px; }
  .mission-inner{ display:grid; grid-template-columns:1.1fr 0.9fr; gap:64px; align-items:start; }
  .mission p{ color:var(--ink-soft); font-size:1.03rem; margin-bottom:18px; max-width:52ch; }
  .mission-fig{
    background:var(--night); border-radius:20px; padding:36px; color:var(--ink-teal);
    position:relative; overflow:hidden;
  }
  .mission-fig svg{ position:relative; z-index:1; }
  .mission-fig .cap{
    font-family:'IBM Plex Mono',monospace; font-size:0.75rem; color:var(--ink-teal-soft);
    margin-top:18px; line-height:1.6; font-weight:600;
  }
  @media (max-width:860px){ .mission-inner{ grid-template-columns:1fr; } }

  /* ---------- COURSES ---------- */
  .courses{ padding:20px 0 100px; background:var(--paper); }
  .filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:36px; }
  .chip{
    font-family:'IBM Plex Mono',monospace; font-size:0.78rem;
    padding:9px 16px; border-radius:100px; border:1px solid var(--line);
    background:#fff; cursor:pointer; color:var(--ink-soft); transition:all .18s ease;
  }
  .chip:hover{ border-color:var(--lapis); color:var(--lapis); }
  .chip.active{ background:var(--night); border-color:var(--night); color:var(--ink-teal); font-weight:700; }

  .course-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
  @media (max-width:960px){ .course-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:640px){ .course-grid{ grid-template-columns:1fr; } }

  .course-card{
    background:#fff; border:1px solid var(--line); border-radius:var(--radius);
    padding:26px; display:flex; flex-direction:column; gap:14px;
    transition:transform .22s ease, box-shadow .22s ease;
  }
  .course-card:hover{ transform:translateY(-4px); box-shadow:0 18px 40px -22px rgba(20,30,60,0.35); }
  .course-top{ display:flex; justify-content:space-between; align-items:flex-start; }
  .course-icon{
    width:42px; height:42px; border-radius:10px; display:flex; align-items:center;
    justify-content:center; background:var(--paper-2);
  }
  .level-tag{
    font-family:'IBM Plex Mono',monospace; font-size:0.68rem; text-transform:uppercase;
    letter-spacing:0.06em; color:var(--ink-soft); background:var(--paper-2);
    padding:4px 9px; border-radius:100px;
  }
  .course-card h3{ font-size:1.15rem; font-weight:600; }
  .course-card p{ color:var(--ink-soft); font-size:0.92rem; }
  .course-meta{
    display:flex; justify-content:space-between; align-items:center;
    padding-top:14px; border-top:1px solid var(--line); font-size:0.85rem;
  }
  .course-meta .teacher{ color:var(--ink-soft); }
  .course-meta .langs{ display:flex; gap:6px; }
  .lang-dot{
    font-family:'IBM Plex Mono',monospace; font-size:0.68rem; color:var(--lapis);
    background:rgba(0,167,157,0.09); padding:3px 8px; border-radius:6px;
  }
  .join-link{ font-weight:700; color:var(--lapis); font-size:0.88rem; display:inline-flex; align-items:center; gap:6px; }
  .join-link svg{ width:14px; height:14px; transition:transform .2s ease; }
  .course-card:hover .join-link svg{ transform:translateX(3px); }

  /* ---------- TEACHERS ---------- */
  .teachers{ background:var(--night); color:var(--ink-teal); padding:100px 0; }
  .teacher-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
  @media (max-width:960px){ .teacher-grid{ grid-template-columns:repeat(2,1fr); } }
  @media (max-width:560px){ .teacher-grid{ grid-template-columns:1fr; } }
  .teacher-card{
    background:var(--night-2); border:1px solid rgba(0,0,0,0.15); border-radius:var(--radius);
    padding:24px; text-align:left;
  }
  .avatar{
    width:52px; height:52px; border-radius:50%; display:flex; align-items:center;
    justify-content:center; font-family:'Fraunces',serif; font-weight:600; font-size:1.1rem;
    color:#08211F; margin-bottom:16px;
  }
  .teacher-card h3{ font-size:1.02rem; font-weight:600; margin-bottom:2px; color:#fff; }
  .teacher-card .role{ color:var(--lapis-light); font-size:0.82rem; margin-bottom:12px; }
  .teacher-card p{ color:#CFEEEA; font-size:0.85rem; }
  .teacher-loc{
    display:flex; align-items:center; gap:6px; margin-top:14px;
    font-family:'IBM Plex Mono',monospace; font-size:0.72rem; color:#9FD8CF;
  }
  .teacher-note{
    margin-top:44px; font-size:0.85rem; color:var(--ink-teal-soft); font-weight:600; max-width:60ch;
  }

  /* ---------- DONATE ---------- */
  .donate{ padding:100px 0; background:var(--paper); }
  .donate-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:start; }
  @media (max-width:900px){ .donate-grid{ grid-template-columns:1fr; } }

  .tiers{ display:flex; flex-direction:column; gap:12px; }
  .tier{
    display:flex; justify-content:space-between; align-items:center;
    padding:20px 22px; border:1px solid var(--line); border-radius:var(--radius);
    background:#fff; cursor:pointer; transition:all .18s ease;
  }
  .tier:hover{ border-color:var(--pomegranate); }
  .tier.active{ border-color:var(--pomegranate); background:#FBEFEF; }
  .tier-amt{ font-family:'Fraunces',serif; font-weight:600; font-size:1.25rem; }
  .tier-desc{ color:var(--ink-soft); font-size:0.88rem; margin-top:2px; }
  .tier-radio{
    width:20px; height:20px; border-radius:50%; border:2px solid var(--line);
    flex-shrink:0; margin-left:16px; position:relative;
  }
  .tier.active .tier-radio{ border-color:var(--pomegranate); }
  .tier.active .tier-radio::after{
    content:""; position:absolute; inset:3px; border-radius:50%; background:var(--pomegranate);
  }
  .donate-panel{
    background:var(--night); color:var(--ink-teal); border-radius:20px; padding:38px;
    position:sticky; top:100px; border:1px solid rgba(0,0,0,0.1);
  }
  .donate-panel .eyebrow{ color:var(--ink-teal); opacity:0.75; margin-bottom:14px; }
  .donate-summary{ font-family:'Fraunces',serif; font-size:2rem; margin:10px 0 6px; color:var(--ink-teal); }
  .donate-summary-desc{ color:var(--ink-teal-soft); font-size:0.92rem; margin-bottom:26px; min-height:44px; font-weight:600; }
  .progress-track{ height:8px; border-radius:100px; background:rgba(5,42,36,0.16); overflow:hidden; margin-bottom:10px; }
  .progress-fill{ height:100%; background:linear-gradient(90deg,var(--ink-teal),var(--pomegranate)); width:63%; border-radius:100px; }
  .progress-label{ font-family:'IBM Plex Mono',monospace; font-size:0.72rem; color:var(--ink-teal-soft); display:flex; justify-content:space-between; margin-bottom:28px; }
  .donate-panel .btn-primary{ width:100%; justify-content:center; }
  .donate-fine{ font-size:0.76rem; color:var(--ink-teal-soft); margin-top:16px; line-height:1.6; }

  /* ---------- TRUST ---------- */
  .trust{ padding:90px 0; }
  .trust-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
  @media (max-width:860px){ .trust-grid{ grid-template-columns:1fr; } }
  .trust-card{ padding:8px 4px; }
  .trust-card .num{
    font-family:'IBM Plex Mono',monospace; font-size:0.78rem; color:var(--lapis); margin-bottom:14px;
  }
  .trust-card h3{ font-size:1.15rem; font-weight:600; margin-bottom:10px; }
  .trust-card p{ color:var(--ink-soft); font-size:0.92rem; }

  /* ---------- FOOTER ---------- */
  footer{ background:var(--night); color:var(--ink-teal-soft); padding:70px 0 30px; }
  .footer-top{
    display:grid; grid-template-columns:1.3fr 1fr 1fr 1.1fr; gap:40px;
    padding-bottom:50px; border-bottom:1px solid rgba(5,42,36,0.2);
  }
  @media (max-width:860px){ .footer-top{ grid-template-columns:1fr 1fr; } }
  @media (max-width:520px){ .footer-top{ grid-template-columns:1fr; } }
  .footer-brand{ display:flex; align-items:center; gap:10px; color:var(--ink-teal); margin-bottom:14px; }
  .footer-col h4{
    font-family:'IBM Plex Mono',monospace; font-size:0.72rem; text-transform:uppercase;
    letter-spacing:0.08em; color:var(--ink-teal-soft); margin-bottom:16px;
  }
  .footer-col a{ display:block; font-size:0.9rem; margin-bottom:11px; color:var(--ink-teal); font-weight:600; }
  .footer-col a:hover{ color:#04211D; text-decoration:underline; }
  .newsletter-form{ display:flex; gap:8px; margin-top:6px; }
  .newsletter-form input{
    flex:1; padding:11px 14px; border-radius:8px; border:1px solid rgba(5,42,36,0.25);
    background:#fff; color:var(--ink); font-size:0.85rem; min-width:0;
  }
  .newsletter-form input::placeholder{ color:#7C89A8; }
  .newsletter-form button{
    background:var(--saffron); border:none; padding:0 16px; border-radius:8px; cursor:pointer;
    font-weight:700; color:#1A1206; font-size:0.85rem;
  }
  .footer-bottom{
    display:flex; justify-content:space-between; align-items:center; padding-top:26px;
    font-size:0.8rem; color:var(--ink-teal-soft); flex-wrap:wrap; gap:12px;
  }

  /* reveal on scroll */
  .reveal{ opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:translateY(0); }

  .toast{
    position:fixed; bottom:26px; left:50%; transform:translate(-50%,20px);
    background:var(--ink-teal); color:#EAFBF8; padding:14px 22px; border-radius:10px;
    font-size:0.88rem; opacity:0; pointer-events:none; transition:all .3s ease;
    border:1px solid rgba(255,255,255,0.1); z-index:200; display:flex; align-items:center; gap:10px;
  }
  .toast.show{ opacity:1; transform:translate(-50%,0); }

  .nav-inner .brand img{
    height: 50px;
    width: 50px;
  }
   .container .footer-top .footer-brand img{
    height: 50px;
    width: 50px;
  }
  
/* =========================================================
   DESKTOP / MOBILE NAVIGATION
   ========================================================= */

.desktop-nav {
  display: flex;
}

.mobile-menu {
  display: none;
}

.menu-btn {
  display: none;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 860px) {

  /* -------------------------
     HEADER
     ------------------------- */

  header.site-nav {
    position: sticky;
    top: 0;
    z-index: 1000;
    overflow: visible;
  }

  .nav-inner {
    position: relative;
    padding: 10px 16px;
    min-height: 70px;
  }


  /* Hide desktop menu */
  .desktop-nav {
    display: none !important;
  }


  /* Show hamburger */
  .menu-btn {
    display: flex;

    width: 42px;
    height: 42px;

    align-items: center;
    justify-content: center;

    padding: 0;

    background: transparent;
    border: none;

    color: var(--ink-teal);

    cursor: pointer;

    position: relative;
    z-index: 1002;
  }

  .menu-btn svg {
    width: 25px;
    height: 25px;
  }


  /* -------------------------
     MOBILE MENU
     ------------------------- */

  .mobile-menu {
    display: block;

    position: absolute;

    top: 100%;
    left: 12px;
    right: 12px;

    background: #FFF9F0;

    border-radius: 0 0 18px 18px;

    box-shadow:
      0 18px 40px rgba(20, 27, 43, 0.18);

    overflow: hidden;

    z-index: 1001;

    opacity: 0;
    visibility: hidden;
    pointer-events: none;

    transform: translateY(-10px);

    transition:
      opacity 0.22s ease,
      transform 0.22s ease,
      visibility 0.22s ease;
  }


  /* OPEN */
  .mobile-menu.open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;

    transform: translateY(0);
  }


  /* -------------------------
     MENU CONTENT
     ------------------------- */

  .mobile-menu-inner {
    padding: 12px;
  }


  .mobile-menu-link {
    display: flex;

    align-items: center;
    justify-content: space-between;

    width: 100%;

    padding: 15px 14px;

    color: var(--ink-teal) !important;

    font-size: 1rem;
    font-weight: 600;

    border-bottom: 1px solid rgba(5, 42, 36, 0.10);

    border-radius: 10px;

    background: transparent;

    transition:
      background 0.2s ease,
      color 0.2s ease;
  }


  .mobile-menu-link:hover,
  .mobile-menu-link:active {
    background: #F3E3C3;
    color: #8A5A00 !important;
  }


  .mobile-arrow {
    font-size: 1.1rem;
    opacity: 0.45;
  }


  /* -------------------------
     LANGUAGE
     ------------------------- */

  .mobile-language {
    display: inline-flex;

    margin: 16px 0 10px;

    padding: 8px 16px;

    border: 1px solid rgba(138, 90, 0, 0.25);

    border-radius: 100px;

    color: #8A5A00 !important;

    font-family: 'IBM Plex Mono', monospace;

    font-size: 0.78rem;
  }


  /* -------------------------
     DONATE
     ------------------------- */

  .mobile-donate {
    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    padding: 14px 20px;

    margin-top: 4px;

    background: var(--saffron);

    color: #1A1206 !important;

    border-radius: 100px;

    font-weight: 700;
  }

}


/* =========================================================
   SMALL PHONES
   ========================================================= */

@media (max-width: 430px) {

  .nav-inner {
    padding: 8px 14px;
  }

  .nav-inner .brand img {
    width: 46px;
    height: 46px;
  }

  .mobile-menu {
    left: 8px;
    right: 8px;
  }

  .mobile-menu-inner {
    padding: 10px;
  }

}


/* =========================================================
   PERSIAN / RTL NAVIGATION
   ========================================================= */

html[lang^="fa"] .site-nav {
  direction: rtl;
}

html[lang^="fa"] .nav-inner {
  direction: rtl;
}

html[lang^="fa"] .mobile-menu {
  direction: rtl;
}

html[lang^="fa"] .mobile-menu-link {
  text-align: right;
}

html[lang^="fa"] .mobile-arrow {
  transform: scaleX(-1);
}

html[lang^="fa"] .mobile-menu-link:hover .mobile-arrow {
  transform: scaleX(-1) translateX(4px);
}



/* Volunteer Section Styling */
.volunteer-section {
  padding: 80px 0;
  background-color: var(--ink-teal, #052A24);
  color: #FFFFFF;
}

.volunteer-card {
  background: rgba(255, 255, 255, 0.03);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 16px;
  padding: 48px;
  max-width: 800px;
  margin: 0 auto;
}

.text-center {
  text-align: center;
}

/* CF7 Form Fields Layout */
.volunteer-form-wrapper {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.form-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20px;
}

@media (max-width: 600px) {
  .form-row {
    grid-template-columns: 1fr;
  }
  .volunteer-card {
    padding: 24px;
  }
}

.form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.form-group label {
  font-size: 0.9rem;
  font-weight: 600;
  color: #EAFBF8;
}

/* Input Overrides */
.volunteer-form-wrapper input[type="text"],
.volunteer-form-wrapper input[type="email"],
.volunteer-form-wrapper select,
.volunteer-form-wrapper textarea {
  width: 100%;
  padding: 12px 16px;
  background-color: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-radius: 8px;
  color: #FFFFFF;
  font-family: inherit;
  font-size: 0.95rem;
  box-sizing: border-box;
  transition: border-color 0.2s ease, background-color 0.2s ease;
}

.volunteer-form-wrapper input:focus,
.volunteer-form-wrapper select:focus,
.volunteer-form-wrapper textarea:focus {
  outline: none;
  border-color: #6BDCD1;
  background-color: rgba(255, 255, 255, 0.1);
}

.volunteer-form-wrapper select option {
  background-color: #052A24;
  color: #FFFFFF;
}

/* Checkbox Alignment */
.volunteer-form-wrapper .wpcf7-checkbox {
  display: flex;
  gap: 20px;
  margin-top: 6px;
}

.volunteer-form-wrapper .wpcf7-list-item {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #FFFFFF;
  cursor: pointer;
}

/* Submit Area */
.form-submit {
  text-align: center;
  margin-top: 10px;
}

.form-submit input[type="submit"] {
  cursor: pointer;
  padding: 14px 32px;
  border-radius: 8px;
  font-weight: 700;
}

/* CF7 System Response Styles */
.wpcf7-response-output {
  margin-top: 20px !important;
  padding: 12px 16px !important;
  border-radius: 8px !important;
  font-size: 0.9rem !important;
  text-align: center;
}

.wpcf7-not-valid-tip {
  color: #FF6B6B;
  font-size: 0.8rem;
  margin-top: 4px;
}


/* Farsi / RTL Adjustments for Volunteer Form */
[dir="rtl"] .volunteer-form-wrapper {
  text-align: right;
}

[dir="rtl"] .volunteer-form-wrapper input[type="text"],
[dir="rtl"] .volunteer-form-wrapper input[type="email"],
[dir="rtl"] .volunteer-form-wrapper select,
[dir="rtl"] .volunteer-form-wrapper textarea {
  text-align: right;
  direction: rtl;
}

/* Checkbox RTL Alignment */
[dir="rtl"] .volunteer-form-wrapper .wpcf7-checkbox {
  display: flex;
  gap: 24px;
  justify-content: flex-start;
  padding: 0;
}

[dir="rtl"] .volunteer-form-wrapper .wpcf7-list-item {
  margin: 0;
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

/* Custom Select Arrow Flip for RTL */
[dir="rtl"] .volunteer-form-wrapper select {
  background-position: left 12px center;
}