/* alhamdfeed.com — static B2B site (VadeCom, 2026-11). Brand: amber/gold logo, feed-bag green, rooster red. */
:root{--ink:#17231b;--ink2:#33423a;--muted:#5f6b62;--paper:#fbf8f1;--paper2:#f3ecde;--line:#e4dccb;--green:#176b3a;--green-d:#0f4a28;--green-s:#e6f2e9;
--amber:#f6a21c;--amber2:#ffc24d;--amber-s:#fff3d9;--red:#d8362a;--white:#fff;--r:18px;--wrap:1200px;
--display:"Readex Pro","IBM Plex Sans Arabic",system-ui,sans-serif;--body:"IBM Plex Sans Arabic","Readex Pro",system-ui,sans-serif}
html[lang="en"]{--body:"Inter","IBM Plex Sans Arabic",system-ui,sans-serif}
*{box-sizing:border-box;min-width:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--body);color:var(--ink);background:var(--paper);line-height:1.85;font-size:17px;overflow-x:clip}
html[lang="en"] body{line-height:1.65}
img{max-width:100%;height:auto;display:block}picture{display:contents}picture source{display:none}a{color:inherit;text-decoration:none}p{margin:0}
h1,h2,h3,h4{font-family:var(--display);margin:0;line-height:1.35;text-wrap:balance}html[lang="en"] h1,html[lang="en"] h2,html[lang="en"] h3{line-height:1.18;letter-spacing:-.01em}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 22px}.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}
.eyebrow{font-family:var(--display);font-weight:600;font-size:.92rem;color:var(--green);display:inline-flex;align-items:center;gap:.5rem}
.eyebrow::before{content:"";width:26px;height:3px;border-radius:3px;background:var(--amber)}
.lead{font-size:1.12rem;color:var(--ink2);max-width:62ch}.muted{color:var(--muted)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;border-radius:999px;padding:.8rem 1.45rem;font-family:var(--display);font-weight:600;font-size:.98rem;border:1.5px solid transparent;transition:.2s;white-space:nowrap;cursor:pointer}
.btn svg{width:20px;height:20px;fill:currentColor;flex-shrink:0}
.b-wa{background:#1faa59;color:#fff}.b-wa:hover{background:#178a47}.b-green{background:var(--green);color:#fff}.b-green:hover{background:var(--green-d)}
.b-amber{background:var(--amber);color:var(--ink)}.b-amber:hover{background:var(--amber2)}.b-line{border-color:var(--line);background:#fff}.b-line:hover{border-color:var(--green);color:var(--green)}
.b-ghost{border-color:rgba(255,255,255,.4);color:#fff}.b-ghost:hover{background:rgba(255,255,255,.12)}
/* top + header */
.top{background:var(--green-d);color:#dbe9df;font-size:.86rem}.top .wrap{display:flex;justify-content:space-between;gap:1rem;align-items:center;min-height:38px;flex-wrap:wrap}
.top a:hover{color:var(--amber2)}.top .ph{display:flex;gap:1.1rem;flex-wrap:wrap}.top .ph span{opacity:.75}
.hdr{position:sticky;top:0;z-index:50;background:rgba(251,248,241,.95);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:78px}
.logo{display:flex;align-items:center;gap:.7rem;flex-shrink:0}.logo img{height:66px;width:auto}
.nav{display:flex;gap:1.5rem;font-family:var(--display);font-weight:500;font-size:.98rem;white-space:nowrap}
.nav a{padding:.4rem 0;border-bottom:2px solid transparent;color:var(--ink2)}.nav a:hover,.nav a[aria-current]{color:var(--green);border-color:var(--amber)}
.hr{display:flex;align-items:center;gap:.6rem}.lang{font-family:var(--display);font-weight:600;font-size:.88rem;padding:.42rem .8rem;border-radius:999px;border:1px solid var(--line);background:#fff}
.burger{display:none;background:none;border:0;padding:.4rem;cursor:pointer;color:var(--ink)}.mnav{display:none;border-top:1px solid var(--line);background:var(--paper);padding:.4rem 22px 1rem}
.mnav a{display:block;padding:.7rem 0;font-family:var(--display);font-weight:500;border-bottom:1px solid var(--line)}.mnav.open{display:block}
@media (max-width:1040px){.nav{display:none}.burger{display:block}}@media (max-width:600px){.hdr .btn{display:none}.logo img{height:50px}.top .ph a:nth-child(n+3){display:none}}
/* hero */
.hero{background:linear-gradient(160deg,#0f4a28 0%,#176b3a 55%,#1d7d45 100%);color:#fff;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:radial-gradient(700px 420px at 12% 0,rgba(246,162,28,.28),transparent 60%),radial-gradient(600px 400px at 100% 100%,rgba(255,255,255,.08),transparent 60%)}
html[dir="rtl"] .hero::before{transform:scaleX(-1)}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center;padding-top:4.2rem;padding-bottom:4.6rem}
.hero .eyebrow{color:var(--amber2)}.hero h1{font-size:clamp(2.1rem,4.4vw,3.35rem);font-weight:700;margin-top:.9rem}.hero h1 em{font-style:normal;color:var(--amber2)}
.hero .lead{color:#e3efe6;margin-top:1.1rem}.hero .cta{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.8rem}
.chips{display:flex;flex-wrap:wrap;gap:.55rem;margin-top:1.7rem}.chip{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:999px;padding:.32rem .9rem;font-size:.9rem;font-weight:500}
.hero-img{border-radius:24px;overflow:hidden;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);border:4px solid rgba(255,255,255,.14)}.hero-img img{width:100%;aspect-ratio:4/3;object-fit:cover}
@media (max-width:920px){.hero .wrap{grid-template-columns:1fr;gap:2rem;padding-top:3rem;padding-bottom:3rem}}
/* values strip */
.vals{background:var(--ink);color:#fff}.vals .wrap{display:grid;grid-template-columns:repeat(4,1fr)}
.vals .v{padding:1.35rem 1rem;border-inline-start:1px solid rgba(255,255,255,.12);display:flex;gap:.8rem;align-items:center}.vals .v:first-child{border:0;padding-inline-start:0}
.vals svg{width:30px;height:30px;fill:var(--amber2);flex-shrink:0}.vals b{font-family:var(--display);display:block;line-height:1.3}.vals span{font-size:.86rem;color:#c8d3cb}
@media (max-width:820px){.vals .wrap{grid-template-columns:repeat(2,1fr)}.vals .v{border:0;padding:1rem 0}}
/* sections */
.sec{padding:5rem 0}.sec.alt{background:var(--paper2)}.sec.dark{background:var(--green-d);color:#fff}.sec.dark .eyebrow{color:var(--amber2)}.sec.dark .lead{color:#dcebe0}
.sec h2{font-size:clamp(1.7rem,3.1vw,2.45rem);font-weight:700;margin-top:.6rem;max-width:26ch}.sec .lead{margin-top:.9rem}
.head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:2.4rem}
.grid{display:grid;gap:1.3rem}.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g5{grid-template-columns:repeat(5,1fr)}
@media (max-width:1000px){.g3{grid-template-columns:repeat(2,1fr)}.g5{grid-template-columns:repeat(3,1fr)}}@media (max-width:640px){.g2,.g3{grid-template-columns:1fr}.g5{grid-template-columns:repeat(2,1fr)}.sec{padding:3.5rem 0}}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;display:flex;flex-direction:column;transition:.2s}
a.card:hover{transform:translateY(-4px);border-color:var(--amber);box-shadow:0 18px 36px -22px rgba(23,35,27,.45)}
.card .im{aspect-ratio:4/3;overflow:hidden;background:var(--paper2)}.card .im img{width:100%;height:100%;object-fit:cover}
.card .bd{padding:1.3rem 1.35rem 1.45rem;display:flex;flex-direction:column;gap:.5rem;flex:1}.card h3{font-size:1.2rem;font-weight:700}.card p{color:var(--muted);font-size:.97rem}
.tags{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.3rem}.tag{background:var(--green-s);color:var(--green-d);border-radius:999px;padding:.12rem .7rem;font-size:.84rem;font-weight:600}
.more{margin-top:auto;padding-top:.6rem;font-family:var(--display);font-weight:600;color:var(--green);font-size:.95rem}
.arr{display:inline-block}html[dir="rtl"] .arr{transform:scaleX(-1)}
.stage{background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.stage .n{font-family:var(--display);font-weight:700;color:var(--amber);font-size:.95rem}
.stage img{width:100%;aspect-ratio:4/3;object-fit:cover}.stage .bd{padding:1.2rem 1.3rem 1.4rem}.stage h3{font-size:1.15rem;margin:.2rem 0 .35rem}.stage p{color:var(--muted);font-size:.96rem}
.feat{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:var(--r);padding:1.5rem}.feat svg{width:34px;height:34px;fill:var(--amber2)}
.feat h3{font-size:1.12rem;margin:.7rem 0 .35rem}.feat p{color:#cfe0d4;font-size:.96rem}
.split{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}@media (max-width:900px){.split{grid-template-columns:1fr;gap:1.8rem}}
.rounded{border-radius:22px;overflow:hidden;box-shadow:0 24px 50px -30px rgba(23,35,27,.5)}.rounded img{width:100%}
.aud{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.8rem;border-top:5px solid var(--amber)}.aud.g{border-top-color:var(--green)}
.aud h3{font-size:1.3rem}.aud ul{margin:.9rem 0 1.2rem;padding:0;list-style:none}.aud li{padding:.35rem 0;padding-inline-start:1.7rem;position:relative;color:var(--ink2)}
.aud li::before{content:"";position:absolute;inset-inline-start:0;top:.95em;width:10px;height:10px;border-radius:50%;background:var(--amber)}.aud.g li::before{background:var(--green)}
.gal{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem}.gal img{border-radius:14px;aspect-ratio:4/3;object-fit:cover;width:100%}@media (max-width:640px){.gal{grid-template-columns:repeat(2,1fr)}}
.band{background:var(--ink);color:#fff;border-radius:26px;padding:2.6rem;display:flex;justify-content:space-between;align-items:center;gap:1.6rem;flex-wrap:wrap;position:relative;overflow:hidden}
.band::after{content:"";position:absolute;inset-inline-end:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:rgba(246,162,28,.25);filter:blur(8px)}
.band h2{font-size:clamp(1.4rem,2.6vw,2rem);margin:0;position:relative;max-width:26ch}.band p{color:#c8d3cb;margin-top:.4rem;position:relative}.band .cta{display:flex;gap:.7rem;flex-wrap:wrap;position:relative}
@media (max-width:640px){.band{padding:1.8rem 1.4rem}.btn{white-space:normal}}
/* inner hero */
.ph1{background:linear-gradient(160deg,#0f4a28,#176b3a);color:#fff;position:relative;overflow:hidden}.ph1::before{content:"";position:absolute;inset:0;background:radial-gradient(600px 320px at 10% 0,rgba(246,162,28,.25),transparent 60%)}
html[dir="rtl"] .ph1::before{transform:scaleX(-1)}.ph1 .wrap{position:relative;padding-top:3.4rem;padding-bottom:3.4rem}.ph1 h1{font-size:clamp(1.9rem,3.8vw,2.9rem);margin-top:.6rem;max-width:24ch}
.ph1 .lead{color:#e3efe6;margin-top:.8rem}.ph1 .eyebrow{color:var(--amber2)}.crumb{font-size:.86rem;color:#bcd3c3;margin-bottom:1rem}.crumb a:hover{color:#fff}
/* products page */
.prod{display:grid;grid-template-columns:.9fr 1.1fr;gap:2.6rem;align-items:center;padding:2.6rem 0;border-top:1px solid var(--line)}.prod:first-child{border-top:0;padding-top:0}
.prod:nth-child(even) .pi{order:2}@media (max-width:900px){.prod{grid-template-columns:1fr;gap:1.4rem}.prod:nth-child(even) .pi{order:0}}
.prod h2{font-size:1.75rem;margin-top:.4rem}.prod p{color:var(--ink2);margin-top:.7rem}
table.sp{width:100%;border-collapse:collapse;margin-top:1.1rem;background:#fff;border-radius:14px;overflow:hidden;border:1px solid var(--line);font-size:.96rem}
table.sp th,table.sp td{padding:.65rem .9rem;text-align:start;border-bottom:1px solid var(--line)}table.sp th{background:var(--green-s);color:var(--green-d);font-family:var(--display);font-weight:600;font-size:.9rem}
table.sp tr:last-child td{border-bottom:0}table.sp td b{font-family:var(--display)}
.note{border:1px dashed var(--line);border-radius:14px;padding:1rem 1.2rem;color:var(--muted);font-size:.93rem;background:rgba(255,255,255,.6)}
/* about */
.vcard{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.5rem}.vcard svg{width:32px;height:32px;fill:var(--green)}.vcard h3{font-size:1.1rem;margin:.6rem 0 .3rem}.vcard p{color:var(--muted);font-size:.96rem}
.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem}.facts div{border-inline-start:4px solid var(--amber);padding-inline-start:1rem}.facts b{font-family:var(--display);font-size:1.5rem;color:var(--green-d);display:block;line-height:1.3}.facts span{color:var(--muted);font-size:.92rem}
@media (max-width:760px){.facts{grid-template-columns:repeat(2,1fr)}}
/* contact */
.form{background:#fff;border:1px solid var(--line);border-radius:22px;padding:1.8rem}.form label{display:block;font-weight:600;font-size:.92rem;margin-bottom:.3rem}
.form input,.form select,.form textarea{width:100%;font:inherit;padding:.75rem .9rem;border:1.5px solid var(--line);border-radius:12px;background:var(--paper);color:var(--ink)}
.form input:focus,.form select:focus,.form textarea:focus{outline:0;border-color:var(--green);background:#fff}.form .row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem}.form .f{margin-bottom:1rem}
@media (max-width:640px){.form .row{grid-template-columns:1fr}}
.chan{display:flex;gap:1rem;align-items:flex-start;padding:1.1rem 0;border-top:1px solid var(--line)}.chan:first-child{border-top:0;padding-top:0}
.chan .ic{width:48px;height:48px;border-radius:13px;background:var(--green-s);color:var(--green);display:grid;place-items:center;flex-shrink:0}.chan .ic svg{width:24px;height:24px;fill:currentColor}
.chan b{font-family:var(--display);display:block}.chan a,.chan span{color:var(--muted)}.chan a:hover{color:var(--green)}.chan .nums{display:flex;flex-wrap:wrap;gap:.2rem 1rem}
.map{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);margin-top:1.4rem}.map iframe{display:block;width:100%;height:300px;border:0}
/* footer */
.ftr{background:var(--ink);color:#c8d3cb}.ftr .wrap{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.2fr;gap:2.2rem;padding-top:3.2rem;padding-bottom:2.2rem}@media (max-width:900px){.ftr .wrap{grid-template-columns:1fr 1fr}}@media (max-width:560px){.ftr .wrap{grid-template-columns:1fr}}
.ftr .fl img{height:70px;width:auto;background:#fff;border-radius:14px;padding:8px}.ftr h4{color:#fff;font-size:.98rem;margin-bottom:.8rem}.ftr ul{margin:0;padding:0;list-style:none}.ftr li{margin:.4rem 0}.ftr a:hover{color:var(--amber2)}
.ftr .bot{border-top:1px solid rgba(255,255,255,.1);max-width:var(--wrap);margin:0 auto;padding:1.1rem 22px;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:#93a399}
.wa{position:fixed;inset-inline-end:18px;bottom:18px;z-index:60;width:56px;height:56px;border-radius:50%;background:#1faa59;color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px -8px rgba(0,0,0,.45)}.wa svg{width:30px;height:30px;fill:currentColor}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}@media (prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}