/* Didim Studio — base styles */

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{margin:0;background:#f7f5f0;color:#272324;font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #c64a17;outline-offset:5px}
button,a{touch-action:manipulation}
img{display:block}
section[id]{scroll-margin-top:20px}
.skip{position:fixed;top:-100px;left:20px;z-index:20;padding:12px;background:white}
.skip:focus{top:10px}
.header{max-width:1440px;padding:22px 5%;margin:auto;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #dedbd5;gap:24px}
.brand{display:flex;gap:10px;align-items:center;font-size:24px;font-weight:750;letter-spacing:-1px;white-space:nowrap}
.brand-light{font-weight:400}
.logo-crop{width:31px;height:48px;position:relative;overflow:hidden;mix-blend-mode:multiply}
.logo-crop img{position:absolute;width:160px;height:160px;max-width:none;top:-42px;left:-65px}
.header nav{display:flex;align-items:center;gap:32px;font-size:14px}
.header nav a:hover,.text-link:hover{color:#bd411d}
.nav-contact{display:flex;gap:28px;border:1px solid #aaa49c;border-radius:100px;padding:10px 19px}
.menu-toggle{display:none}
.hero{max-width:1440px;margin:auto;padding:78px 5% 70px;display:grid;grid-template-columns:1.23fr 1fr;gap:5%;align-items:center}
.eyebrow{text-transform:uppercase;letter-spacing:1.9px;font-size:11px;font-weight:700;margin:0 0 30px;display:flex;gap:10px;align-items:center}
.dot{height:7px;width:7px;border-radius:50%;background:#d94d22}
h1,h2,h3,p{margin-top:0}
h1{font-size:clamp(42px,5.4vw,78px);line-height:1.06;font-weight:500;letter-spacing:-4px;margin-bottom:28px}
em{font-style:normal;color:#bf431f}
.hero-description{font-size:17px;color:#696360;line-height:1.75}
.hero-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:32px}
.button{border:0;display:inline-flex;justify-content:space-between;align-items:center;gap:28px;padding:17px 24px;border-radius:7px;font-size:14px;font-weight:600;cursor:pointer;transition:background .2s,transform .2s}
.primary{background:#c74720;color:white}
.primary:hover{background:#a33415;transform:translateY(-2px)}
.text-link{font-size:13px;display:inline-flex;gap:18px;align-items:center}
.hero-foot{font-size:12px;color:#7b746e;margin:43px 0 0}
.hero-art{min-height:430px;border-radius:18px;background:radial-gradient(ellipse at 70% 70%,#66252c,#251e20 65%);position:relative;overflow:hidden;isolation:isolate;color:#f6e9dc}
.art-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff07 1px,transparent 1px),linear-gradient(90deg,#ffffff07 1px,transparent 1px);background-size:40px 40px}
.art-label,.art-index{position:absolute;font-size:9px;letter-spacing:2px;left:28px;top:25px;color:#c3a7a6}
.art-index{top:auto;bottom:22px}
.orbit{border:1px solid #c9806840;border-radius:50%;position:absolute;inset:50px 22px;transform:rotate(-25deg)}
.orbit-two{inset:75px -70px;transform:rotate(45deg)}
.flame-disc{width:220px;height:220px;background:#fff;border-radius:50%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);box-shadow:0 0 90px #ed5f1d24;display:grid;place-items:center}
.flame-window{position:relative;width:146px;height:191px;overflow:hidden}
.flame-window img{width:576px;height:576px;max-width:none;position:absolute;left:-215px;top:-153px}
.art-chip{position:absolute;background:#f7eee9;border:1px solid #ffffff55;color:#4b2525;box-shadow:0 12px 30px #13090d30;border-radius:8px;font-size:12px;padding:12px 17px;display:flex;gap:24px}
.art-chip b{font-size:16px}
.chip-one{top:88px;left:27px;transform:rotate(-7deg)}
.chip-two{right:18px;top:194px;transform:rotate(6deg)}
.chip-three{bottom:62px;left:38px;transform:rotate(-4deg);background:#ce4a28;color:white}
.service-strip{background:#e9e4dc;border-top:1px solid #ded8ce;border-bottom:1px solid #ded8ce;padding:22px 6%;display:flex;justify-content:space-between;align-items:center;gap:20px;color:#625b56;font-size:13px}
.service-strip i{color:#bd482a;font-size:20px;font-style:normal}
.section{padding:90px max(5%,calc((100vw - 1296px)/2))}
.section-heading{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;margin-bottom:42px}
.section-heading .eyebrow{grid-column:1/-1;margin-bottom:20px}
h2{font-size:clamp(32px,3.6vw,50px);line-height:1.13;letter-spacing:-2px;font-weight:500;margin-bottom:0}
.muted{color:#817b75}
.section-heading>p:last-child:not(.eyebrow){font-size:14px;color:#716a65;justify-self:end;align-self:end;margin:0}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.service-card{border:1px solid #d9d4cb;padding:25px 22px 22px;border-radius:9px;position:relative;display:flex;flex-direction:column;min-width:0}
.service-number{font-size:10px;color:#8b8178}
.service-symbol{font-size:38px;line-height:1;margin:27px 0 25px;color:#ac3f20}
.service-card h3{font-size:21px;letter-spacing:-.6px;margin-bottom:15px}
.service-card p{font-size:13px;color:#706760;line-height:1.75}
.tags{display:flex;gap:5px;flex-wrap:wrap;margin:auto 0 25px;padding-top:12px}
.tags span{font-size:9px;border:1px solid #d9d1c5;border-radius:20px;padding:4px 7px}
.service-card a{border-top:1px solid #d9d4cb;padding-top:16px;display:flex;justify-content:space-between;font-size:12px;gap:10px}
.accent-card{background:#eee3d8;border-color:#d9bdae}
.projects{background:#211d1f;color:#f9f2ea}
.projects .eyebrow{color:#c4a4a0}
.projects .section-heading>p:last-child{color:#b7a8a6}
.warm{color:#d39273}
.project-grid{display:grid;grid-template-columns:1fr 1fr;gap:48px 28px}
.project-visual{height:330px;border-radius:10px;overflow:hidden;display:flex;align-items:center;justify-content:center;padding:30px}
.website-demo{background:#c1b9a7}
.mini-browser{width:100%;max-width:390px;background:#faf7ed;transform:rotate(-4deg);box-shadow:0 18px 40px #29211730;color:#33352a;border-radius:7px;overflow:hidden}
.browser-bar{display:flex;justify-content:space-between;padding:9px 14px;background:#eee9df;font-size:7px;color:#837b70}
.mini-page{padding:16px 22px;position:relative;min-height:220px}
.mini-nav{font-size:12px;letter-spacing:2px;display:flex;justify-content:space-between}
.mini-nav span{font-size:6px;letter-spacing:0}
.mini-page h4{font-size:36px;line-height:1.02;letter-spacing:-2px;font-weight:400;margin:27px 0}
.mini-cta{display:block;font-size:7px;border-top:1px solid #b8b7a7;padding-top:10px}
.architecture{position:absolute;right:22px;top:73px;width:38%;height:110px;display:flex;align-items:end;gap:5px}
.architecture span{width:33%;height:90%;background:linear-gradient(90deg,#8e8c72,#d0c8b0);border-radius:40px 40px 0 0}
.architecture span:nth-child(2){height:120%}
.architecture span:nth-child(3){height:65%}
.bot-demo{background:#6c3339}
.phone{background:#f7efeb;color:#3e3030;max-width:270px;width:100%;padding:14px 14px 20px;border:5px solid #30262b;border-radius:24px;transform:translateY(27px) rotate(5deg);box-shadow:0 18px 35px #21131f4d}
.phone-header{display:flex;align-items:center;justify-content:space-between;font-size:14px;margin-bottom:17px}
.phone-header small{display:block;font-size:7px;color:#7c6669}
.chat-message{font-size:11px;background:white;border-radius:9px;padding:10px 12px;max-width:88%;margin-bottom:9px}
.outgoing{background:#e2c9bb;margin-left:auto;width:max-content}
.time-options{display:grid;grid-template-columns:1fr 1fr;gap:5px;font-size:10px}
.time-options span{text-align:center;padding:7px;background:#e2d5ce;border-radius:5px}
.chat-note{font-size:9px;text-align:center;margin-top:18px;color:#845d5c}
.project-caption{padding-top:20px}
.project-type{text-transform:uppercase;font-size:9px;letter-spacing:1.5px;color:#caa28c}
.project-caption h3{font-size:23px;font-weight:400;letter-spacing:-.6px;margin:9px 0}
.project-caption p{font-size:13px;color:#bdb0ad;max-width:460px;margin:0}
.project-wide{grid-column:1/-1;display:grid;grid-template-columns:1.1fr 1fr;gap:35px;align-items:center}
.ai-demo{height:230px;background:#362b2b;padding:20px;gap:0}
.ai-core{height:90px;min-width:90px;border-radius:50%;background:#bf4928;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:34px;box-shadow:0 0 50px #b64a2233}
.ai-core small{font-size:8px}
.flow-node{border:1px solid #796055;padding:13px 10px;border-radius:6px;font-size:9px;color:#e6c7b6;background:#3e302d}
.flow-node>span{display:block;color:#ef996a;font-size:25px}
.flow-line{height:1px;flex:1;background:#98705d;min-width:12px}
.flow-stack{display:grid;gap:12px}
.process{padding-bottom:100px}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:25px}
.steps article{border-top:1px solid #c5bcb0;padding-top:20px}
.steps article>span{color:#b64727;font-size:12px}
.steps h3{font-size:20px;font-weight:500;margin:20px 0 12px}
.steps p{font-size:13px;color:#71675f;margin:0}
.about{background:#ede7dc;padding-top:64px;padding-bottom:70px}
.about-content{display:grid;grid-template-columns:1.2fr 1fr;gap:70px}
.about-content p{font-size:15px;color:#665c55}
.about-content .text-link{margin-top:10px}
.contact{display:grid;grid-template-columns:1.2fr 1fr;gap:70px;padding-top:100px;padding-bottom:95px}
.contact h2{margin-bottom:28px}
.contact-copy>p:not(.eyebrow){color:#71665f;font-size:14px}
.contact-link{display:flex;gap:50px;align-items:center;font-size:20px;border-bottom:1px solid #d0c2b6;padding-bottom:14px;width:max-content;margin-top:32px}
.email-link{display:block;font-size:14px;margin-top:18px;color:#776c62}
form{padding:28px;background:#eee9e1;border-radius:10px;min-width:0}
label{display:block;font-size:12px;margin-bottom:8px}
input,select,textarea{width:100%;padding:11px 0;color:#322b27;border:0;border-bottom:1px solid #c7bdb1;background:transparent;border-radius:0;margin-bottom:22px;font-size:14px}
textarea{resize:vertical;min-height:80px}
form .button{width:100%}
.form-note,#form-status{font-size:11px;color:#73685e;margin:14px 0 0}
#form-status:empty{display:none}
footer{border-top:1px solid #d9d0c4;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:30px 5%;font-size:11px;color:#786e66}
.footer-brand{color:#3c312b;font-size:20px;letter-spacing:-.7px}
.footer-brand span{display:block;font-size:10px;letter-spacing:0;color:#786e66}
footer>a:last-child{font-size:12px}
@media(min-width:1600px){.service-strip{padding-left:calc((100vw - 1296px)/2);padding-right:calc((100vw - 1296px)/2)}
}
@media(max-width:1000px){.header nav{gap:18px}
.hero{gap:25px;padding-top:55px}
h1{letter-spacing:-2.5px}
.hero-art{min-height:390px}
.art-chip{font-size:10px;padding:10px;gap:15px}
.chip-two{right:10px}
.service-grid{grid-template-columns:repeat(2,1fr)}
.section{padding-top:65px;padding-bottom:65px}
.section-heading>p:last-child:not(.eyebrow){max-width:260px}
.hero-actions{gap:18px}
.hero-description{font-size:15px}
.contact,.about-content{gap:35px}
.project-visual{height:300px;padding:20px}
.project-wide{grid-template-columns:1.2fr 1fr}
.ai-demo{height:220px;padding:12px}
.flow-node{font-size:8px;padding:9px 6px}
.ai-core{min-width:70px;height:70px}
.flow-line{min-width:8px}
}
@media(max-width:700px){html{scroll-padding-top:20px}
.header{padding:16px 6%;position:relative;flex-wrap:wrap}
.brand{font-size:22px}
.menu-toggle{display:flex;gap:16px;align-items:center;background:none;border:1px solid #c8bfb3;border-radius:30px;padding:9px 14px;font-size:12px}
.header nav{display:none;width:100%;padding:16px 0 3px;border-top:1px solid #ddd4c7;flex-direction:column;align-items:stretch;gap:0}
.header nav.open{display:flex}
.header nav a{padding:12px}
.nav-contact{border:0;border-radius:0;color:#a93b1b;justify-content:space-between}
.hero{grid-template-columns:1fr;padding:42px 6% 36px;gap:35px}
h1{font-size:clamp(41px,9.5vw,65px);letter-spacing:-2.2px}
.hero .eyebrow{font-size:9px;margin-bottom:24px}
.hero-description{font-size:15px}
.hero-foot{margin-top:24px}
.hero-art{min-height:335px}
.flame-disc{width:200px;height:200px}
.chip-one{top:60px}
.chip-two{top:150px}
.chip-three{bottom:45px}
.art-index{font-size:8px}
.service-strip{padding:18px 6%;gap:12px;display:grid;grid-template-columns:1fr 1fr;font-size:11px}
.service-strip i{display:none}
.section{padding:54px 6%}
.section-heading{grid-template-columns:1fr;gap:18px;margin-bottom:30px}
.section-heading .eyebrow{margin-bottom:0}
.section-heading>p:last-child:not(.eyebrow){justify-self:start;max-width:none;font-size:13px}
.section-heading>p:last-child br{display:none}
h2{font-size:34px;letter-spacing:-1.4px}
.service-grid{gap:10px}
.service-card{padding:18px 15px}
.service-card h3{font-size:17px}
.service-card p{font-size:12px}
.service-symbol{font-size:30px;margin:20px 0}
.tags span{font-size:8px}
.service-card a{font-size:11px;gap:5px}
.project-grid{grid-template-columns:1fr;gap:35px}
.project-wide{grid-column:auto;display:block}
.project-visual{height:300px}
.project-caption h3{font-size:21px}
.ai-demo{height:230px;padding:20px}
.flow-node{font-size:9px}
.steps{grid-template-columns:1fr 1fr;gap:28px 20px}
.steps h3{font-size:18px}
.steps p{font-size:12px}
.about-content,.contact{grid-template-columns:1fr;gap:28px}
.about-content h2 br:last-child{display:none}
.about .eyebrow{margin-bottom:25px}
.about-content p{font-size:14px}
.contact h2{font-size:38px}
.contact .eyebrow{margin-bottom:24px}
form{padding:23px 20px}
.contact-link{font-size:18px}
footer{flex-wrap:wrap;padding:25px 6%;gap:24px}
.footer-brand{width:100%}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*{transition:none!important}
}


.flame-disc{overflow:hidden}
@media(max-width:380px){.service-grid{grid-template-columns:1fr}
.header{gap:12px}
.brand{font-size:20px}
.menu-toggle{padding:8px 10px}
}



/* ================================================================
   Didim Studio / Art direction v2
   A warm editorial canvas, balanced by a deep aubergine portfolio.
   Typography: Instrument Sans (Latin) + Onest (Cyrillic), with safe fallbacks.
   ================================================================ */
:root {
  --ink: #242025;
  --ink-strong: #161519;
  --canvas: #faf8f5;
  --cream: #f1ece6;
  --line: #e4dcd4;
  --flame: #da4c24;
  --flame-bright: #ee7837;
  --plum: #381a29;
  --soft-ink: #726963;
  --display: 'Instrument Sans', 'Onest', 'Segoe UI', Arial, sans-serif;
}
html { scroll-padding-top: 100px; }
body {
  font-family: var(--display);
  background: var(--canvas);
  color: var(--ink);
  letter-spacing: -.012em;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: #e8a68a; color: #261620; }
.header {
  position: sticky;
  top: 0;
  z-index: 30;
  max-width: none;
  padding: 13px max(5%, calc((100vw - 1296px)/2));
  background: rgba(250,248,245,.91);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
  transition: box-shadow .25s ease, background .25s ease;
}
.header .brand { font-size: 23px; font-weight: 760; letter-spacing: -.075em; }
.header .brand-light { font-weight: 470; }
.header nav { font-weight: 600; font-size: 13px; gap: 32px; }
.header nav a { transition: color .2s ease; }
.nav-contact {
  background: var(--ink-strong);
  color: #fff;
  border-color: var(--ink-strong);
  padding: 12px 18px;
  font-size: 12px;
  font-weight: 700;
  transition: background .2s ease, transform .2s ease;
}
.header nav .nav-contact:hover { color: white; background: #a93a21; transform: translateY(-2px); }
.nav-contact span { font-size: 16px; font-weight: 400; }
.hero {
  max-width: 1440px;
  grid-template-columns: minmax(0,1.08fr) minmax(0,.95fr);
  gap: 5.2%;
  padding-top: 86px;
  padding-bottom: 96px;
}
.hero-copy { padding-bottom: 10px; }
.hero .eyebrow {
  font-size: 10px;
  letter-spacing: .105em;
  border: 1px solid #e3d8cb;
  background: #fff9f2;
  width: max-content;
  max-width: 100%;
  padding: 8px 12px;
  border-radius: 50px;
  margin-bottom: 35px;
  gap: 8px;
  text-transform: uppercase;
  white-space: normal;
}
.hero .eyebrow .dot { display: none; }
.availability-pulse {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--flame-bright);
  flex-shrink: 0;
  box-shadow: 0 0 0 4px #ee783721;
}
h1, h2, h3 { font-family: var(--display); }
h1 {
  font-size: clamp(46px, 5.5vw, 82px);
  line-height: 1.035;
  letter-spacing: -.068em;
  font-weight: 650;
  margin-bottom: 25px;
  text-wrap: balance;
}
h1 em, .about h2 em, .contact h2 em { font-style: normal; }
h1 em {
  display: inline-block;
  background: linear-gradient(105deg,#a62426 3%,#d24422 54%,#f28b35 102%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.headline-period { -webkit-text-fill-color: #bd3a20; }
.hero-description {
  font-size: clamp(15px,1.35vw,18px);
  color: #70645f;
  line-height: 1.68;
  max-width: 490px;
  letter-spacing: -.02em;
}
.hero-actions { margin-top: 35px; gap: 27px; }
.button {
  border-radius: 100px;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: -.01em;
  padding: 17px 23px;
  transition: background .2s, box-shadow .2s, transform .2s;
}
.button span, .text-link span { font-size: 17px; font-weight: 500; }
.button.primary {
  background: linear-gradient(110deg,#bb3322,#e35b27);
  box-shadow: 0 12px 28px #b83e1c24;
}
.button.primary:hover { background: linear-gradient(110deg,#a52b1e,#cc4c1f); box-shadow: 0 17px 35px #b83e1c35; }
.text-link { font-size: 13px; font-weight: 700; gap: 14px; }
.hero-foot {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 11px;
  color: #8a7c73;
  margin-top: 57px;
  letter-spacing: .015em;
}
.hero-foot-line { display: inline-block; width: 26px; height: 1px; background: var(--flame); }
.hero-art {
  min-height: 480px;
  border-radius: 24px;
  background:
    radial-gradient(ellipse at 70% 75%, #863b3c 0%, #4c2734 25%, transparent 65%),
    radial-gradient(ellipse at 15% 20%, #503042, transparent 57%),
    #17161d;
  box-shadow: 0 25px 65px #2618221c;
}
.hero-art:after {
  content: ''; position: absolute; z-index: 0;
  width: 270px; height: 270px; right: -95px; bottom: -125px;
  border-radius: 50%; background: #ff8b4322; filter: blur(55px);
  pointer-events: none;
}
.art-grid { background-size: 42px 42px; opacity: .8; }
.art-label { display: flex; gap: 7px; align-items: center; font-size: 9px; color: #e7c9c2; font-style: normal; }
.art-label i { font-size: 16px; color: #ef8051; font-style: normal; }
.art-index { color: #d4b8b5; font-size: 9px; font-weight: 700; }
.orbit { border-color: #ef967235; }
.flame-disc {
  width: 244px; height: 244px;
  box-shadow: 0 0 0 1px #f4dfd631, 0 0 90px #f36b3840;
  background: #fffdf9;
}
.art-chip { z-index: 2; border-radius: 100px; font-size: 11px; font-weight: 650; letter-spacing: -.02em; }
.chip-one { top: 105px; left: 21px; }
.chip-two { right: 17px; top: 213px; }
.chip-three { bottom: 70px; left: 34px; background: #d64d2a; }
.service-strip {
  background: #f0ebe5;
  color: #554d4b;
  border-color: #e4ddd5;
  padding-top: 22px; padding-bottom: 22px;
  gap: 16px;
  font-size: 12px;
  font-weight: 650;
}
.service-strip .strip-lead { font-size: 9px; letter-spacing: .12em; color: #a58b7d; margin-right: 20px; white-space: nowrap; }
.service-strip i { color: #bd4a2b; font-size: 13px; }
.section { padding-top: 116px; padding-bottom: 118px; }
.section-heading { margin-bottom: 46px; }
.eyebrow { font-size: 10px; letter-spacing: .15em; font-weight: 750; }
.section-heading .eyebrow { margin-bottom: 23px; }
h2 {
  font-size: clamp(37px, 4vw, 58px);
  line-height: 1.07;
  letter-spacing: -.055em;
  font-weight: 630;
  text-wrap: balance;
}
.muted { color: #aaa19a; }
.section-heading>p:last-child:not(.eyebrow) { font-size: 14px; line-height: 1.7; color: #857972; }
.service-grid { gap: 13px; }
.service-card {
  border-radius: 16px;
  padding: 24px 22px 22px;
  background: #fffdfa;
  border: 1px solid #ebe3dd;
  min-height: 355px;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
.service-card:hover { transform: translateY(-7px); box-shadow: 0 19px 45px #41302012; border-color: #ddb9a8; }
.service-number { font-size: 11px; font-weight: 700; color: #ae9083; }
.service-symbol {
  width: 68px; height: 68px; display: grid; place-items: center;
  margin: 22px 0 27px;
  border-radius: 18px;
  background: #f8efe9;
  color: #c94724;
  font-size: 36px;
  transition: background .2s ease;
}
.service-card:hover .service-symbol { background: #f2dfd4; }
.service-card h3 { font-size: 23px; font-weight: 670; letter-spacing: -.045em; margin-bottom: 12px; }
.service-card p { font-size: 13px; line-height: 1.66; color: #71665f; }
.tags { gap: 6px; }
.tags span { font-size: 10px; border-color: #e4d9cf; padding: 5px 9px; background: #fffefa; color: #82736c; }
.service-card a { font-size: 12px; font-weight: 750; border-color: #e9ded7; }
.service-card a span { font-size: 16px; }
.accent-card { background: #391d2a; border-color: #391d2a; color: #fff6f2; }
.accent-card .service-number { color: #d0a7aa; }
.accent-card .service-symbol { background: #633445; color: #ff9d6b; }
.accent-card p { color: #dac4c5; }
.accent-card .tags span { background: #4e2b39; border-color: #764455; color: #f4d5cd; }
.accent-card a { border-color: #704657; }
.accent-card:hover { border-color: #b96864; box-shadow: 0 22px 45px #381a2925; }
.projects { background: #211b23; }
.projects .eyebrow { color: #e5a98e; }
.projects .muted, .projects .warm { color: #edac91; }
.projects .section-heading>p:last-child { color: #c2afaf; }
.project-grid { gap: 56px 30px; }
.project-visual { height: 344px; border-radius: 18px; }
.website-demo { background: linear-gradient(145deg,#d9d0bf,#a1a08c); }
.bot-demo { background: radial-gradient(circle at 25% 20%,#a55c61,#5a2c41 75%); }
.ai-demo { background: radial-gradient(ellipse at 45% 60%,#603737,#35262d); border: 1px solid #ffffff13; }
.project-caption { padding-top: 24px; }
.project-type { color: #ecaa8e; font-weight: 750; letter-spacing: .12em; font-size: 10px; }
.project-caption h3 { font-size: 26px; font-weight: 625; letter-spacing: -.044em; margin: 10px 0; }
.project-caption p { line-height: 1.65; color: #c8b9b7; }
.process { background: #faf8f5; }
.steps { gap: 25px; }
.steps article { border-top: 2px solid #ded3c8; padding-top: 24px; }
.steps article>span { font-size: 12px; font-weight: 700; color: #c24927; }
.steps h3 { font-size: 24px; font-weight: 640; letter-spacing: -.045em; margin: 26px 0 13px; }
.steps p { font-size: 13px; line-height: 1.75; }
.about {
  background: #eee8e0;
  padding-top: 92px;
  padding-bottom: 95px;
  position: relative;
  overflow: hidden;
}
.about:after {
  content: '✳'; position: absolute; font-size: 390px; line-height: 1;
  color: #d9cbc01d; right: -55px; bottom: -130px; pointer-events: none;
}
.about-content { position: relative; z-index: 1; gap: 55px; }
.about-content h2 { font-size: clamp(36px, 3.75vw, 54px); }
.about-content h2 em { color: #b84228; }
.about-content p { font-size: 15px; line-height: 1.8; }
.contact { gap: 8%; }
.contact h2 { font-size: clamp(41px,4.2vw,60px); }
.contact h2 em { color: #c94b2c; }
.contact-copy>p:not(.eyebrow) { font-size: 15px; line-height: 1.75; }
.contact-link { font-weight: 700; font-size: 20px; border-color: #d9c9bd; }
.contact-link span { font-size: 18px; }
.email-link { font-weight: 550; }
#brief-form {
  background: #fffdfa;
  border: 1px solid #e8ded6;
  box-shadow: 0 20px 55px #3c231008;
  padding: 38px;
  border-radius: 20px;
}
label { font-size: 12px; font-weight: 650; }
input, select, textarea { font-size: 14px; border-bottom-color: #daccc0; }
input::placeholder, textarea::placeholder { color: #a99c91; }
input:focus, select:focus, textarea:focus { border-bottom-color: #c34927; outline: none; }
#brief-form .button { width: 100%; }
footer { background: #f2ede7; border-color: #e4dacf; }
.footer-brand { font-size: 22px; font-weight: 750; letter-spacing: -.068em; }
.footer-brand span { letter-spacing: normal; font-weight: 450; }

@media (max-width: 1120px) {
  .service-strip .strip-lead { display: none; }
  .hero { padding-top: 65px; padding-bottom: 70px; gap: 3%; }
  .hero-art { min-height: 405px; }
  h1 { font-size: clamp(43px, 5vw, 70px); }
  .service-card { min-height: 350px; }
}
@media (max-width: 1000px) {
  .header { padding-left: 5%; padding-right: 5%; }
  .section { padding-top: 83px; padding-bottom: 90px; }
  .hero { grid-template-columns: 1.05fr 1fr; }
  .hero-art { min-height: 390px; }
  .service-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .service-card { min-height: 315px; }
  .service-symbol { margin: 16px 0 20px; }
  .project-caption h3 { font-size: 24px; }
}
@media (max-width: 700px) {
  .header { padding: 13px 6%; }
  .header .brand { font-size: 22px; }
  .menu-toggle { font-weight: 700; border-color: #d9cec4; }
  .header nav { background: rgba(250,248,245,.97); border-color: #e7ddd4; font-size: 14px; }
  .header nav a { padding: 13px 10px; }
  .header .nav-contact { background: none; color: #b43e23; border: 0; padding-left: 10px; }
  .header .nav-contact:hover { color: #922b17; background: transparent; }
  .hero { grid-template-columns: 1fr; padding: 47px 6% 50px; gap: 36px; }
  .hero .eyebrow { margin-bottom: 26px; font-size: 9px; }
  h1 { font-size: clamp(43px, 9.5vw, 65px); letter-spacing: -.066em; }
  .hero-description { font-size: 15px; }
  .hero-actions { margin-top: 28px; }
  .hero-foot { margin-top: 30px; }
  .hero-art { min-height: 360px; border-radius: 20px; }
  .art-label { left: 20px; top: 20px; font-size: 8px; }
  .art-index { left: 20px; font-size: 8px; }
  .flame-disc { width: 205px; height: 205px; }
  .art-chip { font-size: 10px; }
  .chip-one { top: 62px; }
  .chip-two { top: 158px; }
  .chip-three { bottom: 53px; }
  .section { padding: 74px 6%; }
  .section-heading { gap: 17px; margin-bottom: 34px; }
  h2 { font-size: clamp(34px, 7.6vw, 43px); letter-spacing: -.055em; }
  .service-grid { gap: 12px; }
  .service-card { min-height: 315px; border-radius: 14px; padding: 18px 15px; }
  .service-card h3 { font-size: 19px; }
  .service-card p { font-size: 12px; }
  .service-symbol { width: 53px; height: 53px; border-radius: 14px; font-size: 28px; margin: 15px 0 18px; }
  .tags span { font-size: 9px; }
  .project-grid { gap: 42px; }
  .project-visual { height: 300px; }
  .project-caption h3 { font-size: 23px; }
  .project-caption p { font-size: 13px; }
  .process { padding-bottom: 80px; }
  .steps h3 { font-size: 21px; }
  .about { padding-top: 70px; padding-bottom: 75px; }
  .about-content { gap: 28px; }
  .contact { gap: 30px; }
  #brief-form { border-radius: 17px; padding: 25px 21px; }
}
@media (max-width: 380px) {
  .service-grid { grid-template-columns: 1fr; }
  .hero-actions { gap: 20px; }
  .hero-art { min-height: 330px; }
  h1 { font-size: 43px; }
  .art-chip { padding: 9px 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .service-card, .header, .nav-contact { transition: none; }
  .service-card:hover, .nav-contact:hover { transform: none; }
}