@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@300;400;500;600;700&display=swap');

:root {
  --ink:#02223A;
  --cream:#FDFBF6;
  --wine:#971A1E;
  --moss:#BCBEC0;
  --gray:#BCBEC0;
  --sand:#BCBEC0;
  --layout-max:1280px;
  --layout-gutter:max(clamp(24px,4vw,64px),calc((100vw - var(--layout-max))/2));
  --fs-display:76px;
  --fs-side:22px;
  --fs-body:18px;
  --fs-ui:16px;
}
* { box-sizing:border-box; }
html { height:100%; scroll-behavior:smooth; }
body { height:100%; margin:0; overflow:hidden; background:var(--ink); color:var(--cream); font-family:"IBM Plex Sans Arabic",sans-serif; font-size:var(--fs-body); line-height:1.9; -webkit-text-size-adjust:100%; text-size-adjust:100%; }
a { color:inherit; text-decoration:none; }
button,input,textarea { font:inherit; }
.darb-page { height:100vh; height:100dvh; overflow-x:hidden; overflow-y:auto; scroll-behavior:smooth; scroll-snap-type:y mandatory; }
.darb-page > section,
.darb-footer { scroll-snap-align:start; scroll-snap-stop:always; }
.section-tag { margin:0 0 24px; color:var(--wine); font-size:var(--fs-ui); font-weight:600; line-height:1.6; }
.light-tag { color:rgba(253,251,246,.68); }

/* Hero */
.darb-hero { min-height:100svh; position:relative; overflow:hidden; isolation:isolate; padding:0 clamp(22px,5.4vw,86px); }
.hero-photos { position:absolute; z-index:-4; inset:0; transform:scale(1.015); }
.hero-slide { position:absolute; inset:0; opacity:0; background-size:cover; background-repeat:no-repeat; animation:hero-slideshow 18s ease-in-out infinite both; }
.hero-slide-one { background-image:url('/images/edge-of-world.jpg'); background-position:center 67%; animation-delay:0s; }
.hero-slide-two { background-image:url('/images/hero-outdoor-learning.jpg'); background-position:center 55%; animation-delay:6s; }
.hero-slide-three { background-image:url('/images/hero-student-expedition.jpg'); background-position:center 50%; animation-delay:12s; }
@keyframes hero-slideshow {
  0% { opacity:0; }
  6%,28% { opacity:1; }
  36%,100% { opacity:0; }
}
.hero-shade { position:absolute; z-index:-3; inset:0; background:linear-gradient(90deg,rgba(2,34,58,.18) 0%,rgba(2,34,58,.46) 44%,rgba(2,34,58,.96) 100%),linear-gradient(0deg,rgba(2,34,58,.74),transparent 48%); }
.hero-grain { position:absolute; z-index:-2; inset:0; opacity:.15; pointer-events:none; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.28'/%3E%3C/svg%3E"); mix-blend-mode:soft-light; }
.darb-nav { height:92px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(253,251,246,.22); position:relative; z-index:4; }
.temp-logo { display:flex; align-items:center; justify-self:start; }
.brand-logo { display:block; width:104px; height:auto; }
.desktop-navigation { display:flex; align-items:center; gap:clamp(20px,3vw,46px); font-size:var(--fs-ui); }
.desktop-navigation a { opacity:.72; transition:opacity .25s; }
.desktop-navigation a:hover { opacity:1; }
.mobile-menu { display:none; }
.burger-button { width:46px; height:46px; border:1px solid rgba(253,251,246,.3); background:rgba(2,34,58,.2); color:var(--cream); padding:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; cursor:pointer; }
.burger-button span { display:block; width:23px; height:2px; background:currentColor; transition:transform .25s,opacity .25s; transform-origin:center; }
.mobile-menu.is-open .burger-button span:nth-child(1) { transform:translateY(7px) rotate(45deg); }
.mobile-menu.is-open .burger-button span:nth-child(2) { opacity:0; }
.mobile-menu.is-open .burger-button span:nth-child(3) { transform:translateY(-7px) rotate(-45deg); }
.mobile-navigation { position:absolute; top:calc(100% + 14px); right:0; width:min(260px,calc(100vw - 40px)); padding:10px; display:flex; flex-direction:column; background:rgba(2,34,58,.97); border:1px solid rgba(253,251,246,.22); box-shadow:0 18px 45px rgba(0,0,0,.24); backdrop-filter:blur(12px); }
.mobile-navigation[hidden] { display:none; }
.mobile-navigation a { min-height:48px; padding:9px 14px; display:flex; align-items:center; border-bottom:1px solid rgba(253,251,246,.14); color:var(--cream); font-size:var(--fs-ui); }
.mobile-navigation a:last-child { border-bottom:0; }
.hero-content { position:relative; z-index:2; padding-top:clamp(90px,15vh,175px); max-width:850px; }
.hero-content h1 { margin:0; font-size:var(--fs-display); font-weight:500; line-height:1.3; letter-spacing:-.03em; }
.hero-content h1 em { display:inline-block; color:var(--gray); font-style:normal; font-weight:300; margin-right:clamp(0px,4vw,64px); }
.hero-lead { max-width:620px; margin:40px 0 0; padding-right:22px; border-right:1px solid rgba(253,251,246,.42); color:rgba(253,251,246,.84); font-size:var(--fs-body); font-weight:300; line-height:1.9; }
.section-cue { position:absolute; z-index:6; left:var(--layout-gutter); bottom:40px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; font-size:var(--fs-ui); line-height:1.5; opacity:.72; transition:color .3s,transform .3s,opacity .3s; }
.section-cue b { font-size:var(--fs-side); line-height:1; }
.section-cue:hover { color:var(--wine); opacity:1; transform:translateY(4px); }
.why-section .section-cue:hover,.contact-section .section-cue:hover { color:var(--gray); }

/* About */
.about-section { min-height:auto; background:var(--cream); color:var(--ink); padding:clamp(100px,13vw,190px) clamp(24px,6vw,96px); display:grid; grid-template-columns:.72fr 1.28fr; grid-template-rows:auto auto 1fr; grid-template-areas:"title title" "intro photo" "copy photo"; gap:42px 6vw; position:relative; overflow:hidden; direction:ltr; }
.about-section>* { direction:rtl; }
.about-title { grid-area:title; }
.about-title h2 { max-width:980px; margin:0; font-size:var(--fs-display); font-weight:300; line-height:1.3; letter-spacing:-.03em; }
.about-title h2 em { display:block; width:max-content; max-width:100%; color:var(--wine); font-style:normal; font-weight:700; }
.about-intro { grid-area:intro; padding-top:18px; align-self:start; }
.about-intro p { margin:0; font-size:var(--fs-body); line-height:1.9; font-weight:400; }
.about-photo-wrap { grid-area:photo; position:relative; min-height:520px; }
.about-photo { position:absolute; inset:0; background:url('/images/student-trail.jpg') center / cover no-repeat; filter:saturate(.68) contrast(.95); }
.about-photo::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(2,34,58,.52),transparent 55%),rgba(2,34,58,.06); mix-blend-mode:multiply; }
.photo-note { position:absolute; right:24px; bottom:22px; color:var(--cream); font-size:var(--fs-ui); }
.about-copy { grid-area:copy; align-self:start; display:flex; flex-direction:column; gap:42px; }
.about-copy p { margin:0; color:rgba(2,34,58,.74); font-size:var(--fs-body); line-height:1.9; }

/* Manifesto */
.manifesto-section { min-height:850px; background:var(--ink); color:var(--cream); position:relative; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:100px 24px; overflow:hidden; }
.manifesto-section h2 { position:relative; z-index:2; margin:0; font-size:var(--fs-display); line-height:1.35; letter-spacing:-.03em; font-weight:300; }
.manifesto-section h2 em { color:var(--wine); font-style:normal; font-weight:500; }
/* Vision */
.vision-section { min-height:1100px; background:var(--gray); color:var(--ink); padding:clamp(100px,12vw,180px) clamp(24px,6vw,96px) 210px; position:relative; }
.vision-section::before { content:""; position:absolute; inset:0; opacity:.08; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.75' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
.vision-heading { display:block; position:relative; }
.vision-heading .section-tag { margin-bottom:22px; }
.vision-heading .light-tag { color:var(--wine); }
.vision-heading h2 { max-width:990px; margin:0; font-size:var(--fs-display); line-height:1.3; letter-spacing:-.03em; font-weight:300; }
.vision-heading h2 em { color:var(--wine); font-style:normal; font-weight:600; }
.vision-cards { margin-top:110px; display:grid; grid-template-columns:1fr 1fr; border-top:1px solid rgba(2,34,58,.30); position:relative; }
.vision-cards article { min-height:360px; padding:36px 42px; border-left:1px solid rgba(2,34,58,.24); position:relative; }
.vision-card-head { display:flex; align-items:center; gap:16px; color:var(--ink); font-size:28px; font-weight:700; }
.vision-card-icon { display:grid; place-items:center; width:48px; height:48px; border:1px solid rgba(2,34,58,.48); font-size:30px; line-height:1; font-weight:400; }
.vision-cards p { max-width:620px; margin:64px 0 0; color:rgba(2,34,58,.84); font-size:22px; line-height:1.9; font-weight:400; }

/* Fields */
.fields-section { background:var(--cream); color:var(--ink); padding:clamp(100px,12vw,180px) clamp(24px,6vw,96px) 210px; position:relative; }
.fields-head { display:block; margin-bottom:90px; }
.fields-head .section-tag { margin-bottom:22px; }
.fields-head h2 { margin:0; font-size:var(--fs-display); line-height:1.3; letter-spacing:-.03em; font-weight:300; }
.fields-head h2 em { color:var(--wine); font-style:normal; font-weight:600; }
.fields-grid { display:grid; grid-template-columns:1.12fr .88fr; min-height:760px; }
.field-card { position:relative; overflow:hidden; padding:42px; display:flex; flex-direction:column; justify-content:flex-end; }
.field-card>div:last-child { position:relative; z-index:2; }
.field-image,.field-overlay,.training-illustration { position:absolute; inset:0; }
.field-image { background:url('/images/edge-of-world.jpg') 42% center / cover no-repeat; filter:saturate(.75); transition:transform .7s; }
.field-card:hover .field-image { transform:scale(1.035); }
.field-overlay { background:linear-gradient(0deg,rgba(2,34,58,.96),rgba(2,34,58,.04) 75%); }
.field-card h3 { max-width:680px; margin:0 0 24px; font-size:30px; line-height:1.55; font-weight:700; }
.field-card p { max-width:680px; margin:0; font-size:20px; line-height:1.9; opacity:.9; }
.field-travel { color:var(--cream); }
.field-training { background:var(--wine); color:var(--cream); }
.training-illustration { background:url('/images/training-development-sketch.png') center top / cover no-repeat; }

/* Why */
.why-section { min-height:1000px; background:var(--ink); padding:clamp(100px,12vw,180px) clamp(24px,6vw,96px) 210px; display:grid; grid-template-columns:1fr; position:relative; }
.why-copy { width:min(760px,100%); margin:0 0 0 auto; }
.why-label { margin-bottom:12px; font-size:28px; font-weight:700; }
.why-kicker { margin:0; color:rgba(253,251,246,.62); font-size:var(--fs-side); line-height:1.6; }
.why-copy h2 { margin:35px 0 0; font-size:var(--fs-display); line-height:1.3; letter-spacing:-.03em; font-weight:300; }
.why-copy h2 strong { font-weight:600; }
.why-copy h2 span { font-weight:300; }
.why-copy h2 em { color:var(--gray); font-style:normal; font-weight:600; }
.reason-list { list-style:none; margin:120px 0 0; padding:48px 0 0; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); direction:rtl; position:relative; }
.reason-list::before { content:""; position:absolute; top:8px; right:0; left:0; height:1px; background:rgba(253,251,246,.36); }
.reason-list>li { min-height:150px; padding:0 20px; display:flex; flex-direction:column; gap:20px; position:relative; transition:color .3s,transform .3s; }
.reason-list>li::before { content:""; position:absolute; right:20px; top:-45px; width:13px; height:13px; border:3px solid var(--ink); background:var(--gray); transform:rotate(45deg); }
.reason-list>li:hover { color:var(--gray); transform:translateY(-6px); }
.reason-list strong { max-width:170px; font-size:var(--fs-side); line-height:1.55; font-weight:500; }
.reason-list i { display:none; }

/* Closing + contact */
.closing-section { min-height:800px; background:var(--cream); color:var(--ink); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:100px 24px; position:relative; overflow:hidden; }
.closing-symbol { display:block; width:120px; height:auto; filter:brightness(.25) saturate(.7); }
.closing-section h2 { position:relative; z-index:2; margin:42px 0 46px; font-size:var(--fs-display); line-height:1.35; letter-spacing:-.03em; font-weight:400; }
.closing-section h2 strong { font-weight:700; }
.closing-section h2 em { color:var(--ink); font-style:normal; font-weight:600; }
.closing-section p { position:relative; z-index:2; margin:0; color:rgba(2,34,58,.78); font-size:var(--fs-side); line-height:1.9; font-weight:500; }
.contact-section { background:var(--ink); padding:clamp(100px,12vw,180px) clamp(24px,6vw,96px) 210px; display:grid; grid-template-columns:.85fr 1.15fr; gap:7vw; position:relative; }
.contact-title { align-self:center; padding-right:clamp(24px,4vw,64px); }
.contact-title .section-tag { color:var(--cream); margin-top:0; }
.contact-title h2 { margin:0; font-size:var(--fs-display); line-height:1.35; letter-spacing:-.03em; font-weight:300; }
.contact-title h2 strong { font-weight:700; }
.contact-title h2 em { color:var(--gray); font-style:normal; font-weight:600; }
.darb-form { display:grid; grid-template-columns:1fr 1fr; gap:28px 22px; align-self:center; }
.darb-form label { display:flex; flex-direction:column; gap:10px; }
.darb-form label span { font-size:var(--fs-ui); color:var(--cream); }
.darb-form input,.darb-form textarea { width:100%; border:0; border-bottom:1px solid rgba(253,251,246,.4); background:transparent; color:var(--cream); outline:none; padding:12px 0; resize:none; font-size:var(--fs-body); line-height:1.8; }
.darb-form input:focus,.darb-form textarea:focus { border-color:var(--cream); }
.message-field { grid-column:1/-1; }
.darb-form button { grid-column:1/-1; border:1px solid rgba(253,251,246,.45); background:transparent; color:var(--cream); height:68px; padding:0 22px; display:flex; align-items:center; justify-content:flex-start; gap:16px; cursor:pointer; transition:.3s; font-size:var(--fs-ui); }
.darb-form button b { font-size:var(--fs-side); line-height:1; font-weight:400; }
.darb-form button:hover { background:var(--cream); color:var(--wine); }
.darb-form button:disabled { cursor:wait; opacity:.62; }
.form-honeypot { position:absolute!important; width:1px!important; height:1px!important; overflow:hidden!important; clip:rect(0 0 0 0)!important; clip-path:inset(50%)!important; white-space:nowrap!important; }
.form-status { grid-column:1/-1; min-height:32px; margin:0; color:var(--cream); font-size:var(--fs-ui); line-height:1.8; }
.form-status.is-success { color:#BCBEC0; }
.form-status.is-error { color:#F2A7A9; }
.darb-footer { min-height:190px; background:var(--ink); padding:38px clamp(24px,6vw,96px); display:flex; align-items:center; justify-content:space-between; gap:40px; direction:ltr; font-size:var(--fs-ui); color:rgba(253,251,246,.72); }
.footer-brand { display:flex; align-items:center; }
.darb-footer .temp-logo { color:var(--cream); }
.copyright { direction:ltr; text-align:right; }

/* Shared 1280px content frame */
.darb-hero,
.about-section,
.manifesto-section,
.vision-section,
.fields-section,
.why-section,
.closing-section,
.contact-section,
.darb-footer { padding-inline:var(--layout-gutter); }

@media (max-width:980px) {
  .about-section { grid-template-columns:1fr; grid-template-rows:auto; grid-template-areas:"title" "intro" "photo" "copy"; }
  .about-intro { padding-top:0; }
  .about-photo-wrap { min-height:520px; }
  .vision-cards { margin-right:0; }
  .fields-grid { grid-template-columns:1fr; }
  .field-card { min-height:650px; }
  .contact-section { grid-template-columns:1fr; }
  .contact-title { padding-right:0; }
  .reason-list { grid-template-columns:1fr; gap:34px; padding:0 42px 0 0; }
  .reason-list::before { top:0; right:9px; bottom:0; left:auto; width:1px; height:auto; }
  .reason-list>li { min-height:auto; padding:0 22px 0 0; gap:6px; }
  .reason-list>li::before { right:-39px; top:10px; }
}

@media (max-width:700px) {
  :root { --fs-display:clamp(44px,13vw,56px); --fs-side:20px; --fs-body:17px; --fs-ui:15px; }
  .darb-page { width:100%; overflow-x:hidden; }
  .darb-hero { min-height:100vh; min-height:100svh; padding-right:max(20px,env(safe-area-inset-right)); padding-left:max(20px,env(safe-area-inset-left)); }
  .darb-nav { min-height:96px; height:96px; padding:12px 0; justify-content:center; }
  .darb-nav>.temp-logo { position:absolute; left:50%; transform:translateX(-50%); }
  .brand-logo { width:84px; }
  .desktop-navigation { display:none; }
  .mobile-menu { display:block; position:absolute; top:50%; right:0; z-index:12; transform:translateY(-50%); }
  .hero-slide-one { background-position:35% 70%; }
  .hero-slide-two { background-position:52% center; }
  .hero-slide-three { background-position:48% center; }
  .hero-shade { background:linear-gradient(90deg,rgba(2,34,58,.45),rgba(2,34,58,.92)),linear-gradient(0deg,rgba(2,34,58,.8),transparent); }
  .hero-content { padding-top:clamp(70px,12vh,120px); max-width:100%; }
  .hero-content h1 { font-size:var(--fs-display); line-height:1.3; }
  .hero-content h1 em { margin-right:0; }
  .hero-lead { max-width:100%; margin-top:28px; padding-right:16px; }
  .section-cue { left:max(20px,env(safe-area-inset-left)); bottom:max(24px,env(safe-area-inset-bottom)); min-width:44px; min-height:44px; }
  .about-section,.vision-section,.fields-section,.why-section,.contact-section { padding-right:max(20px,env(safe-area-inset-right)); padding-left:max(20px,env(safe-area-inset-left)); }
  .about-section { min-height:auto; grid-template-columns:minmax(0,1fr); gap:34px; padding-top:84px; padding-bottom:160px; }
  .about-title h2 { font-size:var(--fs-display); }
  .about-title h2 em { width:auto; }
  .about-intro p,.about-copy p { overflow-wrap:anywhere; }
  .about-photo-wrap { min-height:440px; }
  .about-copy { gap:30px; }
  .manifesto-section { min-height:620px; padding:84px 20px 150px; }
  .manifesto-section h2 { font-size:clamp(42px,12vw,54px); line-height:1.45; }
  .vision-heading .section-tag,.fields-head .section-tag { padding-top:0; }
  .vision-heading h2,.fields-head h2 { font-size:var(--fs-display); }
  .vision-section { min-height:auto; padding-top:84px; padding-bottom:160px; }
  .vision-cards { grid-template-columns:minmax(0,1fr); margin-top:58px; }
  .vision-cards article { min-height:auto; border-left:0; border-bottom:1px solid rgba(2,34,58,.24); padding:30px 0 38px; }
  .vision-card-head { font-size:24px; }
  .vision-card-icon { width:44px; height:44px; font-size:26px; }
  .vision-cards p { margin-top:34px; font-size:18px; overflow-wrap:anywhere; }
  .fields-section { padding-top:84px; padding-bottom:160px; }
  .fields-head { margin-bottom:54px; }
  .fields-grid { grid-template-columns:minmax(0,1fr); }
  .field-card { min-height:560px; padding:26px 22px; }
  .field-card h3 { max-width:100%; font-size:25px; line-height:1.5; }
  .field-card p { max-width:100%; font-size:17px; line-height:1.85; overflow-wrap:anywhere; }
  .training-illustration { background-position:center top; }
  .why-section { min-height:auto; padding-top:84px; padding-bottom:170px; }
  .why-label { font-size:22px; }
  .why-kicker { font-size:18px; }
  .why-copy h2 { font-size:var(--fs-display); }
  .why-copy { margin-right:0; }
  .reason-list { grid-template-columns:minmax(0,1fr); margin-top:64px; padding-right:32px; gap:28px; }
  .reason-list::before { right:7px; }
  .reason-list>li { min-height:72px; padding-right:20px; }
  .reason-list>li::before { right:-32px; top:10px; width:11px; height:11px; }
  .reason-list>li:hover { transform:none; }
  .reason-list strong { max-width:100%; }
  .closing-section { min-height:620px; padding:84px 20px 150px; }
  .closing-symbol { width:96px; }
  .closing-section h2 { margin:34px 0; font-size:clamp(42px,12vw,54px); }
  .closing-section p { max-width:330px; font-size:18px; }
  .contact-section { min-height:auto; gap:62px; padding-top:84px; padding-bottom:170px; }
  .contact-title h2 { font-size:var(--fs-display); }
  .darb-form { grid-template-columns:1fr; }
  .darb-form label { gap:6px; }
  .darb-form input,.darb-form textarea { min-height:48px; font-size:16px; }
  .darb-form textarea { min-height:116px; }
  .message-field,.darb-form button { grid-column:1; }
  .darb-form button { min-height:56px; height:auto; }
  .darb-footer { min-height:210px; padding:34px max(20px,env(safe-area-inset-right)) max(34px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left)); flex-direction:column; align-items:stretch; justify-content:center; gap:26px; }
  .footer-brand { align-self:flex-start; }
  .copyright { align-self:flex-end; }
}

@media (max-width:420px) {
  .hero-content h1,.about-title h2,.vision-heading h2,.fields-head h2,.why-copy h2,.contact-title h2 { letter-spacing:-.04em; }
  .hero-content { padding-top:60px; }
  .field-card { min-height:520px; }
  .section-tag { margin-bottom:16px; }
}

@media (max-height:560px) and (orientation:landscape) {
  .darb-hero { min-height:760px; }
  .hero-content { padding-top:54px; }
}

@media (prefers-reduced-motion:reduce) {
  .darb-page { scroll-snap-type:none; }
  * { scroll-behavior:auto!important; animation:none!important; transition:none!important; }
}
