:root { color-scheme: light; --ink:#203829; --green:#174b37; --muted:#596258; --paper:#faf9f5; --line:#d8ddd3; --wash:#edf0e8; --white:#fff; font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
html { scroll-padding-block:112px 104px; }
body { margin:0; font-size:17px; line-height:1.65; }
a { color:inherit; text-underline-offset:.25em; }
a,button,input,textarea { -webkit-tap-highlight-color:transparent; }
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible { outline:3px solid #a15a24; outline-offset:5px; }
button,input,textarea { font:inherit; }
button,a { touch-action:manipulation; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; opacity:.6; }
img { max-width:100%; display:block; }
h1,h2,h3,p { margin:0; }
h1,h2 { font-family:Georgia,'Times New Roman',serif; font-weight:400; line-height:1.08; letter-spacing:-.035em; text-wrap:balance; }
h1 { font-size:clamp(2.9rem,5.8vw,5.5rem); max-width:16ch; }
h2 { font-size:clamp(2rem,3.7vw,3.3rem); }
h3 { font-size:1.25rem; line-height:1.35; }
p { max-width:62ch; }
p+p { margin-block-start:1.1rem; }
::selection { background:#cbd9b8; color:var(--ink); }
.wrap { width:min(1240px,calc(100% - 96px)); margin-inline:auto; }
.skip { position:absolute; inset-block-start:-100px; inset-inline-start:16px; padding:12px 18px; background:white; z-index:20; }
.skip:focus { inset-block-start:12px; }
.utility { background:var(--ink); color:#fff; font-size:.81rem; }
.utility .wrap { display:flex; align-items:center; justify-content:space-between; gap:1rem; min-height:44px; padding-block:4px; }
.utility a { text-decoration:none; }
.utility-location { display:flex; align-items:center; gap:8px; min-height:36px; }
.utility-location svg { width:15px; height:15px; }
.utility-city { color:#d0d9cd; }
.utility-call { display:flex; gap:12px; align-items:center; font-weight:600; }
.site-header { background:var(--paper); border-block-end:1px solid var(--line); position:sticky; inset-block-start:0; z-index:20; max-height:calc(100dvh - 88px); overflow-y:auto; }
.header-inner { display:flex; align-items:center; gap:28px; min-height:80px; }
.brand { flex-shrink:0; }
.brand img { width:238px; height:auto; aspect-ratio:3/1; object-fit:contain; }
.navigation { margin-inline-start:auto; display:flex; align-items:center; gap:28px; }
.navigation a { padding-block:22px; font-size:.9rem; font-weight:600; text-decoration:none; white-space:nowrap; }
.navigation a:hover,.navigation a[aria-current] { color:var(--green); text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:8px; }
.language { font-size:.85rem; font-weight:bold; text-decoration:none; border-inline-start:1px solid var(--line); padding:10px 0 10px 20px; min-width:48px; text-align:center; }
.menu-toggle { display:none; background:none; border:1px solid var(--line); padding:8px 14px; border-radius:4px; min-height:44px; }
svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
[hidden] { display:none !important; }
.hero { position:relative; min-height:min(650px,calc(100svh - 118px)); display:flex; align-items:center; isolation:isolate; background:var(--ink); color:white; }
.hero-picture,.hero-picture img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 55%; z-index:-2; }
.hero::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(14,34,24,.94) 0%,rgba(14,34,24,.78) 30%,rgba(14,34,24,.05) 80%); z-index:-1; }
.hero-content { padding-block:64px; }
.eyebrow { font-size:.72rem; letter-spacing:.15em; text-transform:uppercase; color:#e1ddba; font-weight:bold; margin-block-end:24px; }
.hero h1 { white-space:pre-line; max-width:14ch; }
.hero p:not(.eyebrow) { margin-block-start:24px; max-width:38ch; color:#f2f3ed; font-size:1.1rem; }
.actions { display:flex; flex-wrap:wrap; align-items:center; gap:18px; margin-block-start:30px; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:13px 23px; border:1px solid var(--green); border-radius:4px; min-height:50px; background:var(--green); color:#fff; font-size:.92rem; font-weight:600; line-height:1.5; text-decoration:none; white-space:nowrap; transition:background .15s ease,transform .15s ease; }
.button:hover { background:#0f3929; }
.button:active { transform:translateY(1px); }
.button.light { background:var(--paper); color:var(--ink); border-color:var(--paper); }
.button.light:hover { background:#e9ede2; }
.button.outline-light { color:white; background:transparent; border-color:#c9d4c7; }
.button.outline-light:hover { background:rgba(255,255,255,.12); }
.text-link { font-weight:600; font-size:.94rem; }
.hero .text-link { color:white; }
.section { padding-block:88px; }
.section-intro { color:var(--muted); margin-block-start:20px; }
.department-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin-block-start:36px; }
.department { text-decoration:none; }
.department img { width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; border-radius:8px; transition:filter .2s ease; }
.department:hover img { filter:brightness(.91); }
.department h3 { margin-block:18px 8px; display:flex; justify-content:space-between; gap:12px; font-size:1.12rem; }
.department h3>span:first-child { min-width:0; }
.department p { color:var(--muted); font-size:.9rem; line-height:1.6; }
.section-bottom { margin-block-start:32px; }
.story { display:grid; grid-template-columns:1.15fr 1fr; align-items:center; background:var(--wash); }
.story>img { width:100%; height:100%; min-height:470px; object-fit:cover; }
.story-copy { padding:clamp(32px,5vw,80px); }
.story h2 { white-space:pre-line; }
.story p { color:var(--muted); margin-block:24px; }
.market-favourites { list-style:none; padding:0; margin:0 0 28px; display:flex; flex-wrap:wrap; gap:8px 20px; }
.market-favourites li { padding-block:6px; border-block-end:1px solid #bfcbb8; font-size:.9rem; font-weight:600; }
.visit-band { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:48px; }
.visit-band h2 { margin-block-end:20px; }
.visit-band p { color:var(--muted); }
.detail-label { font-size:.77rem; font-weight:bold; letter-spacing:.06em; margin-block-end:8px; }
address { font-style:normal; }
.detail-group+.detail-group { margin-block-start:22px; }
.site-footer { background:var(--ink); color:white; padding-block:56px 24px; font-size:.88rem; }
.footer-grid { display:grid; grid-template-columns:1.35fr .75fr 1.2fr; gap:48px; padding-block-end:36px; }
.footer-grid>* { min-width:0; }
.footer-name { font-family:Georgia,serif; font-size:1.6rem; line-height:1.25; }
.footer-arabic { font-size:1.1rem; margin-block:8px 16px; }
.footer-note { color:#d0d9cd; max-width:35ch; }
.footer-brand address { color:#d0d9cd; margin-block-start:20px; }
.footer-heading { font:600 .94rem/1.5 Arial,Helvetica,sans-serif; letter-spacing:0; margin-block-end:12px; }
.footer-nav { display:grid; gap:0; }
.footer-nav a,.footer-contact>a { display:flex; align-items:center; min-height:40px; text-decoration:none; overflow-wrap:anywhere; width:fit-content; max-width:100%; }
.footer-nav a:hover,.footer-contact>a:hover { text-decoration:underline; }
.footer-contact>p { color:#d0d9cd; margin-block:12px 20px; }
.footer-bottom { border-block-start:1px solid #506251; padding-block-start:20px; display:flex; justify-content:space-between; gap:20px; color:#d0d9cd; font-size:.78rem; }
.page-heading { padding-block:64px 52px; border-block-end:1px solid var(--line); }
.page-heading h1 { font-size:clamp(2.7rem,5vw,4.5rem); max-width:20ch; }
.page-heading p { color:var(--muted); margin-block-start:22px; font-size:1.1rem; }
.about-photo { width:100%; height:clamp(270px,38vw,460px); object-fit:cover; }
.prose { max-width:760px; margin-inline:auto; }
.prose h2 { margin-block-end:24px; }
.prose p { color:var(--muted); }
.product-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:52px 36px; }
.product-list img { width:100%; height:300px; object-fit:cover; border-radius:4px; }
.product-list h2 { font-size:2rem; margin-block:20px 12px; }
.product-list p { color:var(--muted); }
.notice { border-inline-start:3px solid var(--green); background:var(--wash); padding:20px 24px; margin-block-end:40px; color:var(--muted); font-size:.94rem; max-width:none; }
.question-band { background:var(--wash); }
.question-band .wrap { display:flex; align-items:center; justify-content:space-between; gap:30px; }
.question-band p { margin-block-start:16px; color:var(--muted); }
.location-layout { display:grid; grid-template-columns:.8fr 1.4fr; gap:64px; }
.location-layout h2 { margin-block-end:24px; }
.map-container { min-height:420px; min-width:0; background:var(--wash); border:1px solid var(--line); border-radius:8px; overflow:hidden; display:flex; align-items:center; justify-content:center; text-align:center; }
.map-container iframe { border:0; width:100%; height:460px; }
.home-visit address { margin-block:24px 12px; }
.social-links { display:flex; flex-wrap:wrap; gap:12px; }
.social-links a { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:44px; border:1px solid #718273; border-radius:4px; padding:8px 12px; font-size:.8rem; text-decoration:none; }
.social-links a:hover { background:#37513e; }
.mobile-actions { display:none; }
.post-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-block-start:32px; align-items:start; }
.social-card { border:1px solid var(--line); border-radius:8px; overflow:hidden; min-width:0; background:white; }
.post-preview { min-height:140px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:16px; align-items:center; text-align:start; padding:24px 20px; background:var(--wash); container-type:inline-size; }
.post-platform { font-size:.78rem; color:var(--muted); margin-block-end:8px; }
.post-copy h3 { font-size:1.1rem; text-wrap:balance; }
.post-preview>.button { font-size:.78rem; padding:10px 14px; min-height:44px; }
.post-link { display:flex; align-items:center; justify-content:space-between; min-height:52px; padding:12px 20px; text-decoration:none; font-size:.86rem; font-weight:600; gap:8px; }
.post-link:hover { background:var(--wash); }
.post-preview.is-loaded { padding:0; background:white; display:block; }
.post-preview iframe { width:100%; height:720px; height:calc(133.4cqi + 190px); border:0; display:block; }
.location-layout>*,.contact-layout>*,.header-inner>* { min-width:0; }
.small { font-size:.9rem; color:var(--muted); margin-block-start:16px; }
.contact-layout { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; }
.contact-layout h2 { font-size:2.4rem; margin-block-end:24px; }
.contact-layout a { overflow-wrap:anywhere; }
.contact-details { background:var(--wash); border-radius:8px; padding:28px; align-self:start; }
form { max-width:600px; }
.field { margin-block-start:22px; }
.field label { display:block; margin-block-end:7px; font-weight:600; font-size:.93rem; }
input,textarea { display:block; width:100%; padding:12px 14px; border:1px solid #899788; border-radius:4px; background:white; color:var(--ink); font-size:1rem; }
textarea { min-height:170px; resize:vertical; }
.form-status { font-size:.95rem; margin-block-start:18px; }
.form-status:empty { display:none; }
html[dir=rtl] { font-family:Tahoma,Arial,sans-serif; }
html[dir=rtl] h1,html[dir=rtl] h2 { font-family:Tahoma,Arial,sans-serif; letter-spacing:0; line-height:1.5; }
html[dir=rtl] .hero::before { background:linear-gradient(270deg,rgba(14,34,24,.94) 0%,rgba(14,34,24,.78) 30%,rgba(14,34,24,.05) 80%); }
html[dir=rtl] .hero h1 { font-size:clamp(2.6rem,5vw,4.5rem); }
html[dir=rtl] .hero .eyebrow { letter-spacing:0; }
html[dir=rtl] .language { padding:10px 20px 10px 0; }
@media (min-width:1600px) { .hero { min-height:690px; } }
@media (max-width:1050px) {
  .wrap { width:calc(100% - 48px); }
  .header-inner { gap:18px; }
  .brand img { width:205px; }
  .navigation { gap:18px; }
  .navigation a { font-size:.82rem; }
  .contact-layout { gap:48px; }
  .location-layout { gap:36px; }
  .department-grid { gap:20px; }
  .department h3 { font-size:1rem; }
  .footer-grid { gap:28px; }
  .post-grid { grid-template-columns:1fr; max-width:700px; }
}
@media (max-width:960px) {
  .header-inner { min-height:80px; flex-wrap:wrap; gap:12px; padding-block:8px; }
  .menu-toggle { display:flex; align-items:center; justify-content:center; gap:8px; margin-inline-start:auto; }
  .language,html[dir=rtl] .language { display:flex; align-items:center; justify-content:center; min-width:44px; min-height:44px; padding:8px; }
  .navigation { width:100%; margin:0; display:grid; grid-template-columns:1fr 1fr; gap:8px; order:5; padding-block:12px; border-block-start:1px solid var(--line); }
  .navigation a { min-height:48px; padding:12px 16px; font-size:.95rem; border-radius:4px; }
  .navigation a[aria-current] { background:var(--wash); text-decoration:none; }
  .has-js .navigation:not(.is-open) { display:none; }
}
@media (max-width:767px) {
  body { font-size:16px; padding-block-end:calc(80px + env(safe-area-inset-bottom)); }
  .wrap { width:calc(100% - 40px); }
  .utility .wrap { display:grid; grid-template-columns:auto minmax(0,1fr); gap:12px; padding-block:0; font-size:.75rem; line-height:1.5; }
  .utility .daily { display:block; text-align:end; }
  .utility-location { min-height:44px; gap:6px; }
  .utility-location svg { width:12px; height:12px; }
  .utility-city { display:none; }
  .utility-call { display:none; }
  .header-inner { min-height:76px; gap:8px; padding-block:8px; }
  .brand img { width:clamp(154px,43vw,190px); }
  .menu-toggle { padding:10px; font-size:.8rem; border:0; gap:6px; }
  .menu-toggle svg { width:18px; }
  .language,html[dir=rtl] .language { font-size:.8rem; padding:8px; }
  .hero { min-height:0; display:flex; flex-direction:column; align-items:stretch; background:var(--paper); color:var(--ink); border-block-end:1px solid var(--line); }
  .hero-picture { position:relative; display:block; height:clamp(190px,53vw,264px); width:100%; inset:auto; z-index:0; }
  .hero-picture img { position:static; width:100%; height:100%; object-position:50% 58%; z-index:auto; }
  .hero-content { padding-block:26px 28px; }
  .hero::before,html[dir=rtl] .hero::before { display:none; }
  .hero h1 { font-size:clamp(2.6rem,10.5vw,3.6rem); line-height:1.04; }
  html[dir=rtl] .hero h1 { font-size:clamp(2.35rem,9.2vw,3.2rem); line-height:1.4; }
  .hero p:not(.eyebrow) { font-size:.97rem; max-width:38ch; color:var(--muted); margin-block-start:16px; }
  .hero .eyebrow { font-size:.63rem; letter-spacing:.08em; color:var(--green); margin-block-end:12px; }
  .actions { gap:12px; margin-block-start:24px; }
  .hero .actions { display:grid; grid-template-columns:1fr 1fr; }
  .hero .button.light { color:white; background:var(--green); border-color:var(--green); }
  .hero .button.outline-light { color:var(--green); border-color:#9eac9b; }
  .button { padding-inline:18px; }
  .section { padding-block:44px; }
  h2 { font-size:2rem; line-height:1.15; }
  .section-intro { margin-block-start:12px; }
  .department-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px 16px; margin-block-start:24px; }
  .department { display:block; padding:0; min-width:0; }
  .department img { width:100%; height:auto; aspect-ratio:4/3; border-radius:6px; }
  .department h3 { margin-block:12px 6px; min-height:2.6em; font-size:1.03rem; gap:8px; }
  .department p { font-size:.83rem; line-height:1.65; }
  .story { grid-template-columns:1fr; }
  .story>img { height:250px; min-height:0; }
  .story-copy { padding:28px 20px 36px; }
  .visit-band { grid-template-columns:1fr; gap:30px; }
  .site-footer { padding-block-start:36px; }
  .footer-grid { display:block; padding-block-end:28px; }
  .footer-grid>div+div { margin-block-start:28px; padding-block-start:24px; border-block-start:1px solid #506251; }
  .footer-nav { grid-template-columns:1fr 1fr; gap:4px 16px; }
  .footer-nav a,.footer-contact>a { min-height:44px; }
  .footer-bottom { flex-direction:column; gap:12px; }
  .page-heading { padding-block:32px 28px; }
  .page-heading h1 { font-size:clamp(2rem,8.5vw,2.8rem); overflow-wrap:break-word; }
  html[dir=rtl] .page-heading h1 { font-size:clamp(1.9rem,8vw,2.7rem); }
  .page-heading p { font-size:1rem; margin-block-start:16px; }
  .product-list { grid-template-columns:1fr; gap:32px; }
  .product-list img { height:auto; aspect-ratio:16/10; }
  .product-list h2 { font-size:1.7rem; }
  .notice { font-size:.87rem; padding:16px 18px; margin-block-end:28px; }
  .question-band .wrap { flex-direction:column; align-items:flex-start; }
  .location-layout,.contact-layout { grid-template-columns:1fr; gap:32px; }
  .map-container { min-height:320px; }
  .map-container iframe { height:360px; }
  .contact-layout h2 { font-size:1.9rem; }
  .contact-layout .detail-group a { display:inline-flex; align-items:center; min-height:44px; }
  .text-link { display:inline-flex; align-items:center; min-height:44px; }
  .post-grid { grid-template-columns:1fr; gap:20px; margin-block-start:24px; }
  .post-preview { min-height:132px; gap:12px; }
  .social-links { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-block-start:16px; }
  .social-links a { padding:10px 12px; gap:8px; font-size:.75rem; }
  .mobile-actions { position:fixed; z-index:10; inset:auto 0 0; display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:10px max(16px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); background:var(--paper); border-block-start:1px solid var(--line); box-shadow:0 -4px 20px rgba(32,56,41,.06); }
  .mobile-actions a { display:flex; justify-content:center; align-items:center; gap:10px; min-height:48px; border:1px solid #9eac9b; border-radius:6px; font-size:.88rem; font-weight:600; text-decoration:none; }
  .mobile-actions a:first-child { background:var(--green); color:white; border-color:var(--green); }
  input,textarea { scroll-margin-block:24px 120px; }
}
@media (max-width:359px) { .wrap { width:calc(100% - 32px); } .header-inner { gap:4px; } .menu-toggle { padding-inline:6px; } .hero .eyebrow { letter-spacing:.04em; } .department-grid { gap:24px 12px; } .department h3 { font-size:.95rem; } .social-links { grid-template-columns:1fr; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { transition:none !important; scroll-behavior:auto !important; } }
