:root{
    --forest:#1B3A2B;
    --forest-deep:#122A1F;
    --moss:#6B8F5C;
    --moss-light:#DCE6D3;
    --parchment:#F3EEE1;
    --parchment-dim:#EAE3D2;
    --bark:#4A3A2C;
    --ochre:#B98A3A;
    --ochre-light:#F1E0BC;
    --ink:#22261F;
    --ink-soft:#5C5F55;
    --line:#D9D2BE;
  }
  *{box-sizing:border-box;}
  body{margin:0;background:#EDE9DD;font-family:'Inter',sans-serif;color:var(--ink);}
  h1,h2,h3{font-family:'Fraunces',serif;font-weight:500;margin:0;}
  .wrap{max-width:1180px;margin:0 auto;padding:48px 24px 120px;}
  .intro{max-width:640px;margin:0 auto 56px;text-align:center;}
  .intro h1{font-size:28px;margin-bottom:10px;}
  .intro p{color:var(--ink-soft);font-size:15px;line-height:1.6;}
  .page-label{font-family:'Inter';font-size:12px;letter-spacing:.02em;color:var(--ink-soft);margin:64px 0 12px;padding-left:4px;}
  .frame{background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.04);}
  .frame-bar{background:#E4DECC;padding:9px 14px;display:flex;gap:6px;border-bottom:1px solid var(--line);}
  .dot{width:9px;height:9px;border-radius:50%;background:#C9C1A8;}

  /* ---------- HOME ---------- */
  .home-hero{background:var(--forest);color:var(--parchment);padding:64px 56px 0;position:relative;overflow:hidden;}
  .nav{display:flex;justify-content:space-between;align-items:center;padding-bottom:48px;font-size:14px;}
  .nav .brand{font-family:'Fraunces';font-size:19px;letter-spacing:.01em;}
  .nav .links{display:flex;gap:28px;color:#C8D3C0;}
  .nav .cta{background:var(--parchment);color:var(--forest-deep);padding:9px 18px;border-radius:5px;font-weight:500;}
  .hero-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end;}
  .hero-grid h1{font-size:44px;line-height:1.12;max-width:480px;}
  .hero-grid .lede{color:#C8D3C0;font-size:15.5px;line-height:1.65;max-width:400px;margin:20px 0 28px;}
  .btn-row{display:flex;gap:14px;margin-bottom:56px;}
  .btn-primary{background:var(--ochre);color:#3A2907;padding:12px 22px;border-radius:5px;font-weight:500;font-size:14.5px;}
  .btn-ghost{border:1px solid #4C6656;color:var(--parchment);padding:12px 22px;border-radius:5px;font-size:14.5px;}
  .rings{position:relative;height:280px;}
  .ring{position:absolute;border-radius:50%;border:1px solid #33513F;}
  .stat-strip{background:var(--forest-deep);display:flex;padding:26px 56px;margin-top:8px;}
  .stat{flex:1;border-right:1px solid #274536;}
  .stat:last-child{border:none;}
  .stat b{font-family:'Fraunces';font-size:26px;color:var(--parchment);display:block;}
  .stat span{font-size:12.5px;color:#93A78C;}
  .home-section{padding:52px 56px;background:#fff;}
  .home-section h2{font-size:23px;margin-bottom:6px;}
  .home-section .sub{color:var(--ink-soft);font-size:14px;margin-bottom:28px;}
  .variety-row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
  .variety{border:1px solid var(--line);border-radius:8px;overflow:hidden;}
  .variety .swatch{height:76px;}
  .variety .info{padding:12px 14px;}
  .variety .info b{font-size:14px;display:block;}
  .variety .info span{font-size:12.5px;color:var(--ink-soft);}
  .home-impact{background:var(--moss-light);padding:44px 56px;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;}
  .home-impact .map-mock{height:190px;border-radius:8px;background:#fff;border:1px solid #C7D6BB;position:relative;overflow:hidden;}

  /* ---------- DONATE ---------- */
  .donate{padding:0;background:#fff;}
  .donate-top{padding:28px 56px 0;border-bottom:1px solid var(--line);}
  .breadcrumb{font-size:12.5px;color:var(--ink-soft);padding-bottom:18px;}
  .donate-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:0;}
  .donate-left{padding:32px 56px;}
  .donate-left h2{font-size:22px;margin-bottom:22px;}
  .tree-pick{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:30px;}
  .tree-card{border:1.5px solid var(--line);border-radius:8px;padding:14px;text-align:center;cursor:default;}
  .tree-card.selected{border-color:var(--forest);background:#F5F8F2;}
  .tree-card .ic{height:44px;display:flex;align-items:center;justify-content:center;margin-bottom:8px;}
  .tree-card b{font-size:13.5px;display:block;}
  .tree-card span{font-size:12px;color:var(--ink-soft);}
  .qty-row{display:flex;align-items:center;gap:14px;padding:18px;background:var(--parchment);border-radius:8px;margin-bottom:20px;}
  .qty-box{width:34px;height:34px;border:1px solid var(--line);border-radius:6px;display:flex;align-items:center;justify-content:center;background:#fff;}
  .field-label{font-size:12.5px;color:var(--ink-soft);margin-bottom:6px;}
  .input-mock{border:1px solid var(--line);border-radius:6px;padding:11px 13px;font-size:14px;color:var(--ink-soft);}
  .donate-right{background:var(--forest-deep);color:var(--parchment);padding:32px 40px;}
  .donate-right h3{font-size:16px;margin-bottom:20px;}
  .sum-row{display:flex;justify-content:space-between;font-size:13.5px;padding:10px 0;border-bottom:1px solid #274536;color:#B9C7B2;}
  .sum-row.total{color:var(--parchment);font-weight:500;border:none;padding-top:16px;font-size:15px;}
  .donate-right .btn-primary{width:100%;text-align:center;margin-top:22px;}

  /* ---------- PROFILE ---------- */
  .profile{background:var(--parchment);}
  .profile-head{background:var(--forest);color:var(--parchment);padding:36px 56px;display:flex;gap:20px;align-items:center;}
  .avatar{width:60px;height:60px;border-radius:50%;background:var(--moss);display:flex;align-items:center;justify-content:center;font-family:'Fraunces';font-size:20px;}
  .profile-head h2{font-size:21px;}
  .profile-head .sub{font-size:13px;color:#B9C7B2;margin-top:4px;}
  .stars{display:flex;gap:3px;margin-top:8px;}
  .star{width:14px;height:14px;background:var(--ochre);clip-path:polygon(50% 0%,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%);}
  .profile-body{padding:36px 56px;display:grid;grid-template-columns:2fr 1fr;gap:32px;}
  .tree-gallery h3{font-size:16px;margin-bottom:16px;}
  .g-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
  .g-card{background:#fff;border:1px solid var(--line);border-radius:9px;overflow:hidden;}
  .g-photo{height:100px;position:relative;}
  .g-info{padding:11px 13px;}
  .g-info b{font-size:13px;display:block;}
  .g-info .loc{font-size:11.5px;color:var(--ink-soft);display:flex;align-items:center;gap:4px;margin-top:3px;}
  .pin{width:7px;height:7px;border-radius:50% 50% 50% 0;background:#B23B3B;transform:rotate(-45deg);display:inline-block;}
  .side-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:18px;margin-bottom:16px;}
  .side-card h4{font-size:13.5px;margin-bottom:12px;color:var(--ink-soft);font-family:'Inter';font-weight:500;}
  .tier-bar{height:7px;background:var(--parchment-dim);border-radius:4px;overflow:hidden;margin:10px 0 6px;}
  .tier-fill{height:100%;background:var(--ochre);width:64%;}

  /* ---------- LEADERBOARD ---------- */
  .leader{background:#fff;padding:40px 56px;}
  .leader h2{font-size:22px;margin-bottom:4px;}
  .leader .sub{color:var(--ink-soft);font-size:14px;margin-bottom:26px;}
  .lb-row{display:grid;grid-template-columns:32px 1fr auto auto;align-items:center;gap:18px;padding:14px 4px;border-bottom:1px solid var(--line);}
  .lb-row:first-child{border-top:1px solid var(--line);}
  .rank{font-family:'Fraunces';color:var(--ink-soft);font-size:15px;}
  .lb-name{display:flex;align-items:center;gap:10px;}
  .lb-avatar{width:32px;height:32px;border-radius:50%;background:var(--moss-light);}
  .lb-name b{font-size:14px;}
  .lb-trees{font-size:13px;color:var(--ink-soft);}

  /* ---------- VARIETIES CATALOG ---------- */
  .cat{background:#fff;padding:40px 56px;}
  .cat h2{font-size:22px;margin-bottom:4px;}
  .cat .sub{color:var(--ink-soft);font-size:14px;margin-bottom:24px;}
  .cat-filters{display:flex;gap:10px;margin-bottom:26px;}
  .chip{border:1px solid var(--line);border-radius:20px;padding:7px 16px;font-size:12.5px;color:var(--ink-soft);}
  .chip.active{background:var(--forest);color:var(--parchment);border-color:var(--forest);}
  .cat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
  .cat-card{border:1px solid var(--line);border-radius:9px;overflow:hidden;}
  .cat-card .photo{height:110px;display:flex;align-items:center;justify-content:center;}
  .cat-card .body{padding:14px 16px;}
  .cat-card b{font-size:14.5px;display:block;margin-bottom:3px;}
  .cat-card .desc{font-size:12.5px;color:var(--ink-soft);line-height:1.5;margin-bottom:10px;}
  .cat-card .foot{display:flex;justify-content:space-between;align-items:center;font-size:13px;}
  .tag-sm{font-size:11px;background:var(--moss-light);color:#3B5730;padding:3px 9px;border-radius:12px;}

  /* ---------- IMPACT MAP ---------- */
  .impact-page{background:#fff;}
  .impact-top{padding:32px 56px 0;}
  .impact-top h2{font-size:22px;}
  .impact-top .sub{color:var(--ink-soft);font-size:14px;margin:4px 0 20px;}
  .impact-layout{display:grid;grid-template-columns:1fr 300px;gap:0;border-top:1px solid var(--line);}
  .big-map{height:340px;background:#EFF4E8;position:relative;}
  .impact-side{padding:24px;border-left:1px solid var(--line);}
  .impact-side h4{font-size:13px;color:var(--ink-soft);font-weight:500;margin-bottom:14px;}
  .site-item{display:flex;justify-content:space-between;font-size:13px;padding:10px 0;border-bottom:1px solid var(--line);}
  .site-item b{display:block;font-size:13.5px;}
  .site-item span{color:var(--ink-soft);font-size:12px;}

  /* ---------- ABOUT ---------- */
  .about-hero{background:var(--moss-light);padding:60px 56px;text-align:center;}
  .about-hero h1{font-size:30px;max-width:600px;margin:0 auto 14px;line-height:1.25;}
  .about-hero p{color:#4A5A40;font-size:15px;max-width:520px;margin:0 auto;line-height:1.6;}
  .about-body{padding:48px 56px;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
  .about-block h3{font-size:16px;margin-bottom:8px;}
  .about-block p{font-size:13.5px;color:var(--ink-soft);line-height:1.6;}
  .contact-strip{background:var(--forest-deep);color:var(--parchment);padding:36px 56px;display:flex;justify-content:space-between;align-items:center;}
  .contact-strip h3{font-size:18px;}
  .contact-strip .sub{color:#9DB093;font-size:13px;margin-top:4px;}

  /* ---------- LOGIN / SIGNUP ---------- */
  .auth-page{background:var(--forest);padding:60px 56px;display:flex;justify-content:center;}
  .auth-card{background:var(--parchment);border-radius:10px;padding:38px 40px;width:360px;}
  .auth-card h2{font-size:21px;margin-bottom:6px;}
  .auth-card .sub{color:var(--ink-soft);font-size:13.5px;margin-bottom:24px;}
  .auth-field{margin-bottom:16px;}
  .auth-field .field-label{margin-bottom:6px;}
  .auth-input{background:#fff;border:1px solid var(--line);border-radius:6px;padding:11px 13px;font-size:13.5px;color:var(--ink-soft);}
  .auth-btn{background:var(--forest);color:var(--parchment);text-align:center;padding:12px;border-radius:6px;font-size:14px;font-weight:500;margin-top:6px;}
  .auth-alt{text-align:center;font-size:12.5px;color:var(--ink-soft);margin-top:16px;}

  /* ---------- ADMIN ---------- */
  .admin-shell{display:grid;grid-template-columns:200px 1fr;min-height:420px;background:#fff;}
  .admin-nav{background:var(--forest-deep);color:var(--parchment);padding:24px 0;}
  .admin-nav .brand{font-family:'Fraunces';font-size:16px;padding:0 20px 22px;}
  .admin-item{padding:11px 20px;font-size:13px;color:#AEC0A5;}
  .admin-item.active{background:#1F3D2B;color:var(--parchment);border-left:2px solid var(--ochre);}
  .admin-main{padding:28px 32px;}
  .admin-main h2{font-size:19px;margin-bottom:20px;}
  .admin-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:26px;}
  .admin-stat{background:var(--parchment);border-radius:8px;padding:14px 16px;}
  .admin-stat span{font-size:12px;color:var(--ink-soft);}
  .admin-stat b{font-family:'Fraunces';font-size:22px;display:block;margin-top:4px;}
  .admin-table{border:1px solid var(--line);border-radius:8px;overflow:hidden;}
  .a-row{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;padding:12px 16px;font-size:13px;border-bottom:1px solid var(--line);align-items:center;}
  .a-row.head{background:var(--parchment);color:var(--ink-soft);font-size:11.5px;}
  .a-row:last-child{border:none;}
  .status-pill{font-size:11px;padding:3px 10px;border-radius:10px;display:inline-block;}
  .status-pill.ok{background:var(--moss-light);color:#3B5730;}
  .status-pill.pending{background:var(--ochre-light);color:#7A5A1E;}

  /* ---------- ABOUT US / TEAM ---------- */
  .team-hero{background:var(--forest);color:var(--parchment);padding:52px 56px;}
  .team-hero .eyebrow{font-size:12.5px;color:#9DB093;margin-bottom:10px;}
  .team-hero h1{font-size:28px;max-width:520px;line-height:1.28;}
  .team-hero p{color:#C8D3C0;font-size:14.5px;max-width:480px;margin-top:12px;line-height:1.6;}
  .team-body{padding:44px 56px;background:#fff;}
  .team-body h2{font-size:19px;margin-bottom:22px;}
  .team-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;}
  .member-card{border:1px solid var(--line);border-radius:9px;overflow:hidden;}
  .member-photo{height:120px;display:flex;align-items:center;justify-content:center;}
  .member-info{padding:14px 15px;}
  .member-info b{font-size:14px;display:block;}
  .member-info .role{font-size:12px;color:var(--ochre);font-weight:500;margin:2px 0 8px;}
  .member-info .bio{font-size:12px;color:var(--ink-soft);line-height:1.5;}
  .founder-strip{background:var(--moss-light);padding:36px 56px;display:flex;gap:26px;align-items:center;}
  .founder-photo{width:84px;height:84px;border-radius:50%;flex-shrink:0;}
  .founder-strip b{font-size:15.5px;display:block;}
  .founder-strip .role{font-size:12.5px;color:#3B5730;font-weight:500;margin:2px 0 8px;}
  .founder-strip p{font-size:13px;color:#4A5A40;line-height:1.6;max-width:640px;}

  /* ---------- DONOR TYPE TOGGLE ---------- */
  .type-toggle{display:flex;gap:8px;margin-bottom:22px;}
  .type-opt{border:1px solid var(--line);border-radius:20px;padding:8px 18px;font-size:12.5px;color:var(--ink-soft);}
  .type-opt.active{background:var(--forest);color:var(--parchment);border-color:var(--forest);}

  /* ---------- REFERRALS ---------- */
  .ref-card{background:linear-gradient(0deg,var(--forest-deep),var(--forest-deep));background:var(--forest-deep);color:var(--parchment);border-radius:10px;padding:22px 24px;margin-bottom:16px;}
  .ref-card h4{font-size:14px;margin-bottom:6px;font-family:'Inter';font-weight:500;}
  .ref-card .sub{font-size:12.5px;color:#9DB093;margin-bottom:16px;}
  .ref-link-row{display:flex;gap:10px;align-items:center;background:#1F3D2B;border:1px solid #2E4C3B;border-radius:6px;padding:10px 14px;}
  .ref-link-row span{font-size:12.5px;color:#C8D3C0;flex:1;font-family:'Inter';}
  .ref-copy{font-size:12px;background:var(--ochre);color:#3A2907;padding:6px 14px;border-radius:5px;font-weight:500;}
  .ref-stats{display:flex;gap:24px;margin-top:16px;}
  .ref-stats div b{font-family:'Fraunces';font-size:18px;display:block;}
  .ref-stats div span{font-size:11.5px;color:#9DB093;}

  /* ---------- ORG DASHBOARD ---------- */
  .org-head{background:var(--forest);color:var(--parchment);padding:32px 56px;display:flex;gap:18px;align-items:center;}
  .org-logo-box{width:60px;height:60px;border-radius:8px;background:#fff;display:flex;align-items:center;justify-content:center;font-family:'Fraunces';font-size:15px;color:var(--forest);}
  .org-head h2{font-size:20px;}
  .org-head .sub{font-size:13px;color:#B9C7B2;margin-top:4px;}
  .org-body{padding:32px 56px;}
  .org-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px;}
  .org-stat{background:var(--parchment);border-radius:8px;padding:16px 18px;}
  .org-stat span{font-size:12px;color:var(--ink-soft);}
  .org-stat b{font-family:'Fraunces';font-size:22px;display:block;margin-top:4px;}
  .bulk-row{display:flex;gap:14px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:9px;padding:18px 20px;margin-bottom:20px;}
  .bulk-row .field-label{margin-bottom:5px;}
  .employee-note{font-size:12px;color:var(--ink-soft);margin-top:4px;}

  /* ---------- LOGO WALL ---------- */
  .logowall{background:#fff;padding:44px 56px;}
  .logowall h2{font-size:22px;margin-bottom:4px;}
  .logowall .sub{color:var(--ink-soft);font-size:14px;margin-bottom:28px;}
  .logo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;}
  .logo-tile{border:1px solid var(--line);border-radius:9px;height:80px;display:flex;align-items:center;justify-content:center;background:var(--parchment);}
  .logo-tile span{font-family:'Fraunces';font-size:13.5px;color:var(--ink-soft);}

  /* ---------- PHOTO GALLERY ---------- */
  .gallery{background:#fff;padding:44px 56px;}
  .gallery h2{font-size:22px;margin-bottom:4px;}
  .gallery .sub{color:var(--ink-soft);font-size:14px;margin-bottom:26px;}
  .gal-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:120px;gap:12px;}
  .gal-item{border-radius:8px;overflow:hidden;position:relative;}
  .gal-item .cap{position:absolute;bottom:0;left:0;right:0;background:rgba(18,42,31,.72);color:var(--parchment);font-size:11px;padding:6px 9px;}
  .gal-item.tall{grid-row:span 2;}
  .gal-item.wide{grid-column:span 2;}

  /* ---------- TESTIMONIALS ---------- */
  .testi{background:var(--parchment);padding:48px 56px;}
  .testi h2{font-size:22px;margin-bottom:4px;}
  .testi .sub{color:var(--ink-soft);font-size:14px;margin-bottom:28px;}
  .testi-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-bottom:18px;}
  .testi-card{background:#fff;border:1px solid var(--line);border-radius:9px;padding:20px 22px;}
  .testi-quote{font-family:'Fraunces';font-size:15px;line-height:1.55;color:var(--ink);margin-bottom:16px;}
  .testi-person{display:flex;align-items:center;gap:10px;}
  .testi-avatar{width:36px;height:36px;border-radius:50%;flex-shrink:0;}
  .testi-person b{font-size:13px;display:block;}
  .testi-person span{font-size:11.5px;color:var(--ink-soft);}
  .testi-org-row{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
  .testi-org{background:#fff;border:1px solid var(--line);border-radius:9px;padding:18px 20px;}
  .testi-org .org-name{font-family:'Fraunces';font-size:13.5px;margin-bottom:8px;color:var(--forest);}
  .testi-org p{font-size:12.5px;color:var(--ink-soft);line-height:1.55;}

*{box-sizing:border-box} html{scroll-behavior:smooth}
body{background:#EDE9DD}
.site-header{position:sticky;top:0;z-index:100;background:#122A1F;color:#F3EEE1;border-bottom:1px solid #274536}
.site-nav{max-width:1180px;margin:auto;padding:0 24px;min-height:68px;display:flex;align-items:center;gap:24px}
.site-brand{font-family:'Fraunces',serif;font-size:19px;white-space:nowrap}
.site-links{margin-left:auto;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.site-links a{color:#C8D3C0;font-size:13px;text-decoration:none}
.site-links a:hover,.site-links a.active{color:#fff}
.site-links .nav-cta{background:#B98A3A;color:#3A2907;padding:9px 15px;border-radius:5px;font-weight:600}
.menu-btn{display:none;margin-left:auto;border:0;background:none;color:#fff;font-size:24px;cursor:pointer}
.site-footer{background:#122A1F;color:#B9C7B2;margin-top:0;padding:35px 24px}
.site-footer-inner{max-width:1180px;margin:auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:30px}
.site-footer h3{color:#fff;font-size:16px;margin-bottom:10px}.site-footer a{display:block;font-size:12px;margin:7px 0;text-decoration:none}
.demo-note{max-width:1180px;margin:20px auto 0;padding:0 24px;color:#5C5F55;font-size:12px}
.page-content{max-width:1180px;margin:auto;padding:24px}
.frame{background:#fff;border:1px solid #D9D2BE;border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.btn,.btn-primary,.btn-ghost{cursor:pointer}
input,select,textarea,button{font-family:inherit}
@media(max-width:900px){
 .site-links{display:none;position:absolute;top:68px;left:0;right:0;background:#122A1F;padding:18px 24px;flex-direction:column;align-items:flex-start}
 .site-links.open{display:flex}.menu-btn{display:block}
 .site-footer-inner{grid-template-columns:1fr 1fr}
}
@media(max-width:650px){
 .page-content{padding:12px}.site-footer-inner{grid-template-columns:1fr}
 .hero-grid,.donate-grid,.profile-body,.impact-layout{grid-template-columns:1fr!important}
 .variety-row,.cat-grid,.team-grid,.admin-stats,.org-stats,.logo-grid,.testi-grid,.testi-org-row{grid-template-columns:1fr 1fr!important}
}


/* =========================================================
   Responsive / Mobile-First Enhancement
   Tested layout targets: 320px, 375px, 414px, 768px,
   1024px and large desktop widths.
   ========================================================= */

html {
  overflow-x: hidden;
  -webkit-text-size-adjust: 100%;
}

body {
  min-width: 0;
  overflow-x: hidden;
}

img, svg, video, iframe, canvas {
  max-width: 100%;
  height: auto;
}

button, input, select, textarea {
  max-width: 100%;
  font: inherit;
}

.container {
  width: min(1180px, calc(100% - 32px));
  margin-inline: auto;
}

.table-wrap, .responsive-table, .overflow-x {
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-wrap table, .responsive-table table {
  min-width: 640px;
}

/* Safe wrapping for long labels/URLs */
a, p, h1, h2, h3, h4, h5, h6, td, th, label {
  overflow-wrap: anywhere;
}

/* Tablet */
@media (max-width: 900px) {
  .container {
    width: min(100% - 28px, 760px);
  }

  .grid-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .grid-3 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .grid-2 {
    grid-template-columns: 1fr !important;
  }

  .hero,
  .hero-grid,
  .split,
  .two-col,
  .content-grid {
    grid-template-columns: 1fr !important;
  }

  .hero {
    padding-block: 48px;
  }

  .hero-copy {
    max-width: 720px;
  }

  .dashboard-grid,
  .stats-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .card-grid,
  .gallery-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

/* Mobile */
@media (max-width: 640px) {
  .container {
    width: calc(100% - 24px);
  }

  body {
    font-size: 15px;
  }

  h1 {
    font-size: clamp(2rem, 9vw, 3rem) !important;
    line-height: 1.05;
  }

  h2 {
    font-size: clamp(1.55rem, 7vw, 2.25rem) !important;
  }

  h3 {
    font-size: 1.2rem !important;
  }

  section {
    padding-block: 42px !important;
  }

  .hero {
    padding-block: 38px !important;
  }

  .hero-actions,
  .actions,
  .button-row,
  .cta-actions {
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
  }

  .hero-actions > *,
  .actions > *,
  .button-row > *,
  .cta-actions > * {
    width: 100%;
  }

  .grid-4,
  .grid-3,
  .grid-2,
  .dashboard-grid,
  .stats-grid,
  .card-grid,
  .gallery-grid,
  .cards,
  .features {
    grid-template-columns: 1fr !important;
  }

  .card,
  .panel,
  .stat-card,
  .feature-card {
    width: 100%;
  }

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

  .nav,
  .main-nav,
  .navbar {
    position: relative;
  }

  .nav-links,
  .main-nav ul,
  .navbar-menu {
    display: none;
    width: 100%;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 4px !important;
    padding: 10px 0;
  }

  .nav-links.is-open,
  .main-nav ul.is-open,
  .navbar-menu.is-open {
    display: flex;
  }

  .nav-links a,
  .main-nav a,
  .navbar-menu a {
    display: block;
    width: 100%;
    padding: 11px 8px;
  }

  .nav-toggle {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    min-width: 44px;
    min-height: 44px;
  }

  .form-grid,
  .form-row,
  .input-grid {
    grid-template-columns: 1fr !important;
  }

  input, select, textarea {
    width: 100%;
    min-height: 44px;
  }

  textarea {
    min-height: 120px;
  }

  button,
  .btn,
  a.btn,
  .button {
    min-height: 44px;
  }

  .modal {
    padding: 12px !important;
  }

  .modal-content,
  .dialog {
    width: 100% !important;
    max-width: 100% !important;
    max-height: calc(100vh - 24px);
    overflow-y: auto;
  }

  .table-wrap {
    margin-inline: -6px;
    width: calc(100% + 12px);
  }

  .table-wrap table,
  .responsive-table table {
    min-width: 620px;
  }

  .footer-grid,
  .footer-links,
  footer .grid {
    grid-template-columns: 1fr !important;
  }

  footer {
    text-align: center;
  }

  .hide-mobile {
    display: none !important;
  }

  .show-mobile {
    display: block !important;
  }
}

/* Very small phones */
@media (max-width: 380px) {
  .container {
    width: calc(100% - 20px);
  }

  .logo,
  .brand {
    max-width: 75vw;
  }

  .hero {
    padding-block: 30px !important;
  }

  .card,
  .panel,
  .stat-card,
  .feature-card {
    padding: 16px !important;
  }

  .table-wrap table,
  .responsive-table table {
    min-width: 560px;
  }
}

/* Touch-friendly interaction and reduced motion */
@media (hover: none) and (pointer: coarse) {
  a, button, select, input[type="checkbox"], input[type="radio"] {
    -webkit-tap-highlight-color: rgba(27, 58, 43, .12);
  }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}