/* Shootistan public website: editorial photography with a quiet product language. */
:root {
  --ink:#182337; --body:#566074; --dim:#737b8b;
  --bg:#fbfaf7; --soft:#f0eee9; --soft2:#e9e8e3; --line:#dedfdc;
  --brand:#4546c7; --brand2:#7475e6; --brand-soft:#edecfb;
  --grad:linear-gradient(110deg,#4445c3,#5757d8);
  --blue:#4546c7; --blue-soft:#edecfb;
  --r:12px; --sh:0 28px 70px -36px #18233745; --sh-sm:0 12px 34px -24px #18233733;
}
body { font-size:16px; }
.wrap { max-width:1240px; padding-inline:32px; }
section { padding-block:100px; }
h1,h2,h3,h4 { letter-spacing:-.045em; }
.abar { background:#192439; color:#fff; font-size:12px; padding:10px 18px; letter-spacing:.025em; }
.nav { background:#fbfaf7f5; border-bottom:1px solid var(--line); box-shadow:none; }
.nav .wrap { min-height:86px; }
.logo em,.logo span { color:var(--ink); }
.btn { border-radius:7px; padding:14px 22px; font-size:14px; font-weight:600; }
.btn-p,.btn-p:hover { box-shadow:none; }
.btn-p:hover { background:#3535a4; transform:none; }
.btn-o { background:transparent; border:1px solid var(--line); }
.btn-lg { min-height:52px; padding:15px 25px; font-size:14px; }
.k { border-radius:3px; background:transparent; padding:0; color:var(--brand); font-size:11px; letter-spacing:.16em; }
.card { border-radius:10px; box-shadow:none; }
.card:hover { box-shadow:var(--sh-sm); }
.mock { border-radius:10px; box-shadow:var(--sh); }
footer { background:#182337; }
footer .logo em,footer .logo span { color:#fff; }
footer a:hover { color:#cccaff; }
footer a[style*="f59a3e"] { color:#cccaff!important; }
.mcta a { background:var(--brand); }
:focus-visible { outline:3px solid #7e7ee9; outline-offset:4px; }
.ed-hero { padding:66px 0 80px; }
.ed-hero-grid { display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,1fr); gap:65px; align-items:center; }
.ed-label { display:flex; gap:9px; align-items:center; font-size:10px; text-transform:uppercase; letter-spacing:.17em; font-weight:700; color:var(--brand); margin-bottom:25px; }
.ed-label::before { content:''; width:6px; height:6px; background:var(--brand); border-radius:50%; }
.ed-hero h1 { font-size:clamp(42px,5vw,68px); line-height:1.04; letter-spacing:-.065em; font-weight:700; max-width:620px; }
.ed-hero h1 em { font-family:Georgia,serif; font-weight:400; color:var(--brand); }
.ed-intro { max-width:480px; margin:25px 0 27px; font-size:17px; line-height:1.8; }
.ed-buttons { display:flex; flex-wrap:wrap; gap:12px; align-items:center; }
.ed-small { font-size:11px; color:var(--dim); margin-top:17px; }
.ed-photo { position:relative; margin:0; padding:0 0 28px 20px; }
.ed-photo::before { content:''; position:absolute; inset:26px 24px 0 0; border:1px solid #d9d0be; border-radius:180px 180px 10px 10px; }
.ed-photo img { display:block; position:relative; width:100%; height:500px; object-fit:cover; object-position:78% center; border-radius:180px 180px 10px 10px; background:#e9e3d7; }
.ed-photo figcaption { position:absolute; bottom:7px; left:46px; padding:10px 15px; border:1px solid #e3e0d8; border-radius:5px; background:#fffcf6; font-size:11px; color:var(--ink); box-shadow:var(--sh-sm); }
.ed-photo figcaption span { color:var(--dim); margin-left:18px; }
.ed-credit { margin:16px 0 0; font-size:11px; color:var(--dim); }
.ed-strip { border-block:1px solid var(--line); padding:23px 0; }
.ed-strip .wrap { display:flex; align-items:center; justify-content:space-between; gap:20px; flex-wrap:wrap; font-size:11px; letter-spacing:.025em; }
.ed-strip strong { color:var(--ink); font-weight:600; }
.ed-heading { display:flex; justify-content:space-between; gap:48px; align-items:end; margin-bottom:42px; }
.ed-heading h2,.ed-story h2,.ed-final h2 { font-size:clamp(31px,3.4vw,46px); line-height:1.12; font-weight:600; max-width:560px; }
.ed-heading p { max-width:330px; font-size:14px; line-height:1.8; }
.ed-product { border:1px solid #d9dee7; background:#fff; border-radius:12px; box-shadow:0 26px 70px -40px #18233765; overflow:hidden; }
.ed-product-top { display:flex; justify-content:space-between; padding:17px 25px; border-bottom:1px solid #e7eaf0; font-size:11px; color:#728097; }
.ed-product-top strong { color:#25314b; font-size:14px; }
.ed-product-body { display:grid; grid-template-columns:175px 1fr; min-height:340px; }
.ed-sidebar { padding:25px 16px; background:#fafbfe; border-right:1px solid #e7eaf0; font-size:12px; }
.ed-sidebar span { display:block; padding:11px 13px; margin-bottom:4px; color:#69788e; border-radius:6px; }
.ed-sidebar .ed-selected { background:#edecfb; color:#4546c7; font-weight:600; }
.ed-work { padding:29px; min-width:0; }
.ed-work-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:24px; }
.ed-work h3 { font-size:23px; letter-spacing:-.04em; }
.ed-example { font-size:10px; letter-spacing:.09em; text-transform:uppercase; color:#7c8493; }
.ed-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:13px; margin-bottom:24px; }
.ed-stats div { border:1px solid #e5e9ef; border-radius:7px; padding:17px; }
.ed-stats span { font-size:10px; color:#768194; display:block; }
.ed-stats strong { font-size:24px; color:#28354c; font-weight:600; display:block; margin-top:5px; letter-spacing:-.04em; }
.ed-record { display:grid; grid-template-columns:1.7fr 1fr auto; gap:16px; align-items:center; padding:16px 0; border-top:1px solid #ecedf2; font-size:12px; color:#25314b; }
.ed-record small { display:block; color:#7c8493; font-size:10px; margin-top:3px; }
.ed-record b { font-weight:500; }
.ed-badge { font-size:10px; padding:5px 9px; background:#edf6ee; border-radius:4px; color:#367a56; }
.ed-badge.await { background:#fff3dd; color:#94722d; }
.ed-feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:34px; margin-top:42px; }
.ed-feature-grid article { border-top:1px solid var(--line); padding-top:22px; }
.ed-feature-grid .ed-num { font-size:11px; color:var(--brand); font-weight:600; margin-bottom:14px; }
.ed-feature-grid h3 { font-size:19px; margin-bottom:12px; letter-spacing:-.03em; }
.ed-feature-grid p { font-size:13px; line-height:1.85; }
.ed-story { background:#f0eee8; }
.ed-story-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:90px; align-items:center; }
.ed-story img { width:100%; height:420px; object-fit:cover; border-radius:8px; display:block; }
.ed-story p { font-size:15px; margin:22px 0; max-width:430px; }
.ed-story .ed-small { font-size:11px; margin-top:12px; }
.ed-text-link { font-size:13px; color:var(--brand); font-weight:600; display:inline-block; border-bottom:1px solid #b6b4e9; padding-bottom:4px; }
.ed-roadmap { display:grid; grid-template-columns:repeat(4,1fr); border:1px solid var(--line); border-radius:8px; overflow:hidden; }
.ed-roadmap article { padding:28px 25px; border-right:1px solid var(--line); background:#fffefa; }
.ed-roadmap article:last-child { border-right:0; }
.ed-roadmap h3 { font-size:21px; margin:22px 0 13px; }
.ed-roadmap p { font-size:12px; line-height:1.8; }
.ed-status { font-size:9px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:#4546c7; }
.ed-planned { color:#7d818a; }
.ed-final { background:#202741; color:#c6cadd; }
.ed-final .wrap { display:flex; align-items:center; justify-content:space-between; gap:45px; }
.ed-final h2 { color:#fff; margin-bottom:20px; }
.ed-final .k { color:#b6b4ff; }
.ed-final p { max-width:500px; font-size:14px; }
.ed-final .btn { background:#f3f0e8; color:#252744; white-space:nowrap; }
.ed-final .ed-small { color:#a7abc1; text-align:center; }
.ed-faq { max-width:820px; margin:auto; }
.ed-faq h2 { font-size:34px; margin-bottom:30px; }
.ed-faq details { border-top:1px solid var(--line); padding:20px 0; }
.ed-faq summary { cursor:pointer; color:var(--ink); font-weight:600; font-size:15px; }
.ed-faq p { font-size:14px; padding-top:15px; max-width:720px; }
@media(max-width:1000px) {
  .ed-hero-grid { gap:36px; }.ed-photo img { height:440px; }.ed-hero h1 { font-size:49px; }
  .ed-story-grid { gap:44px; }.ed-roadmap { grid-template-columns:repeat(2,1fr); }.ed-roadmap article:nth-child(2) { border-right:0; }.ed-roadmap article:nth-child(-n+2) { border-bottom:1px solid var(--line); }
}
@media(max-width:760px) {
  .wrap { padding-inline:22px; } section { padding-block:65px; }.nav .wrap { min-height:73px; }
  .ed-hero { padding:42px 0 55px; }.ed-hero-grid,.ed-story-grid { grid-template-columns:1fr; }.ed-hero h1 { font-size:clamp(41px,8vw,58px); max-width:560px; }.ed-intro { font-size:15px; }.ed-photo { max-width:560px; width:100%; margin:15px auto 0; }.ed-photo img { height:420px; }
  .ed-heading { display:block; }.ed-heading p { margin-top:20px; max-width:520px; }.ed-product-body { grid-template-columns:1fr; }.ed-sidebar { display:none; }.ed-work { padding:22px; }.ed-feature-grid { gap:20px; }.ed-story img { height:340px; }
  .ed-final .wrap { display:block; }.ed-final .ed-buttons { margin-top:30px; }.ed-final .ed-small { text-align:left; }
}
@media(max-width:480px) {
  .wrap { padding-inline:20px; }.ed-label { font-size:9px; letter-spacing:.12em; }.ed-photo img { height:360px; }.ed-photo figcaption { left:35px; font-size:10px; }.ed-photo figcaption span { margin-left:10px; }
  .ed-strip .wrap { display:block; }.ed-strip span { display:block; margin-top:8px; }.ed-product-top { padding:14px 16px; }.ed-work { padding:20px 15px; }.ed-work h3 { font-size:20px; }.ed-example { font-size:8px; }
  .ed-stats { gap:7px; }.ed-stats div { padding:12px 9px; }.ed-stats strong { font-size:20px; }.ed-stats span { font-size:9px; }.ed-record { grid-template-columns:1fr auto; gap:10px; }.ed-record>div:nth-child(2) { display:none; }.ed-feature-grid,.ed-roadmap { grid-template-columns:1fr; }.ed-feature-grid article { padding-top:20px; }.ed-roadmap article { border-right:0; border-bottom:1px solid var(--line); }.ed-roadmap article:last-child { border-bottom:0; }.ed-story img { height:300px; }.ed-heading h2,.ed-story h2,.ed-final h2 { font-size:34px; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }

.ed-hero-grid>*,.ed-story-grid>* { min-width:0; }

/* Approved S + Focus brand. The PNG stays unmodified on every background. */
.logo .brand-symbol { width:36px; height:36px; flex:0 0 36px; display:block; object-fit:contain; }
.logo .brand-wordmark { color:var(--ink); font-weight:700; letter-spacing:-.04em; line-height:1; }
footer .logo .brand-symbol { background:#fff; padding:4px; border-radius:8px; }
footer .logo .brand-wordmark { color:#fff; }
