:root{
  --bg:#f7f5f1;--paper:#fcfbf8;--ink:#34363b;--muted:#686b70;
  --charcoal:#34363a;--charcoal-2:#292b2f;--gold:#c89b42;--gold-light:#e4c77d;
  --line:#ded8cf;--shadow:0 18px 45px rgba(45,45,45,.12);
  --serif:Georgia,'Times New Roman',serif;--sans:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{
margin:0;
background:
  radial-gradient(circle at 78% 14%, rgba(215,184,117,.14), transparent 20%),
  radial-gradient(circle at 88% 24%, rgba(255,255,255,.92), transparent 26%),
  linear-gradient(180deg, #fbfaf7 0%, #f5f2ed 36%, #f7f5f1 100%);
color:var(--ink);font-family:var(--sans);line-height:1.6}
a{color:inherit;text-decoration:none} img{max-width:100%;display:block} button,input{font:inherit}
.container{width:min(1280px,calc(100% - 40px));margin-inline:auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(252,251,248,.9);backdrop-filter:blur(14px);border-bottom:1px solid rgba(200,155,66,.25)}
.header-inner{min-height:86px;display:flex;align-items:center;gap:36px}
.brand{display:flex;align-items:center;gap:15px;margin-right:auto}
.monogram{font-family:var(--serif);font-size:42px;line-height:1;color:var(--gold)}
.brand strong{display:block;font-family:var(--serif);font-size:23px;font-weight:500;letter-spacing:.03em}
.brand small{display:block;color:var(--gold);font-size:10px;letter-spacing:.3em}
.nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}
.nav a{position:relative;padding:30px 0 25px}.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:18px;height:2px;background:var(--gold);transition:.25s}
.nav a:hover::after,.nav a.active::after{right:0}
.contact-btn,.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:9px;padding:14px 22px;border:1px solid var(--gold);font-weight:700;letter-spacing:.035em;transition:.22s}
.contact-btn,.btn-primary{background:linear-gradient(135deg,var(--gold-light),var(--gold));color:#26231e;box-shadow:0 8px 22px rgba(200,155,66,.22)}
.btn:hover,.contact-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(68,58,39,.18)}
.btn-secondary{background:rgba(255,255,255,.58)}
.menu-toggle{display:none;border:0;background:none;font-size:28px}

.hero{position:relative;overflow:hidden;padding:70px 0 42px;background:
radial-gradient(circle at 80% 26%,rgba(200,155,66,.08),transparent 28%),
linear-gradient(120deg,#fbfaf7,#efede8)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(200,155,66,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(200,155,66,.06) 1px,transparent 1px);background-size:44px 44px;mask-image:linear-gradient(to right,transparent,#000 70%)}
.hero-grid{position:relative;display:grid;grid-template-columns:1.04fr .96fr;align-items:center;gap:40px}
.eyebrow{color:#a67625;letter-spacing:.28em;font-size:15px;text-transform:uppercase;margin:0 0 18px}
.hero h1{font-family:var(--serif);font-size:clamp(48px,5.5vw,78px);line-height:1.03;font-weight:500;margin:0 0 20px}
.gold-rule{width:90px;height:3px;background:linear-gradient(90deg,var(--gold),transparent);margin:0 0 26px}
.lead{max-width:650px;font-size:19px;color:#55585c;margin-bottom:30px}
.hero-actions{display:flex;gap:16px;flex-wrap:wrap}
.hero-art{
  min-height:460px;
  display:grid;
  place-items:center;
  position:relative;
  align-self:stretch;
}
.hero-art::before{
  content:"";
  position:absolute;
  inset:5% 2% 10% 8%;
  border-radius:38px;
  background:
    radial-gradient(circle at 70% 28%, rgba(212,181,111,.20), transparent 18%),
    linear-gradient(145deg, rgba(255,255,255,.78), rgba(231,233,236,.34));
  box-shadow:
    inset 0 0 0 1px rgba(204,171,98,.28),
    0 22px 36px rgba(60,55,48,.06);
  z-index:0;
}
.hero-art::after{
  content:"";
  position:absolute;
  right:5%;
  top:2%;
  width:190px;
  height:190px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(255,255,255,.72) 0%, rgba(255,255,255,.18) 48%, rgba(255,255,255,0) 72%);
  z-index:0;
  pointer-events:none;
}
.hero-art img{
  width:min(100%,690px);
  position:relative;
  z-index:1;
  justify-self:end;
  align-self:end;
  filter:drop-shadow(0 18px 24px rgba(70,65,55,.08));
}

.quick-links{position:relative;margin-top:-18px;padding-bottom:52px}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.card{background:linear-gradient(145deg,var(--charcoal),var(--charcoal-2));color:white;border-radius:14px;padding:27px;min-height:170px;box-shadow:var(--shadow);border:1px solid rgba(228,199,125,.18);position:relative;overflow:hidden;transition:.25s}
.card::before{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.05),transparent);transform:translateX(-100%);transition:.5s}
.card:hover{transform:translateY(-5px)}.card:hover::before{transform:translateX(100%)}
.icon{width:48px;height:48px;border:1px solid var(--gold);border-radius:50%;display:grid;place-items:center;color:var(--gold);font-size:22px;margin-bottom:18px}
.card h3{font-family:var(--serif);font-size:25px;font-weight:500;margin:0 0 8px}.card p{margin:0;color:#d2d2d0;font-size:14px}
.arrow{position:absolute;right:20px;bottom:18px;color:var(--gold);font-size:25px}

.section{padding:76px 0}.section-title{font-family:var(--serif);font-size:44px;line-height:1.15;margin:0}.section-kicker{color:var(--gold);text-transform:uppercase;letter-spacing:.23em;font-size:12px;font-weight:700}
.about-grid{display:grid;grid-template-columns:310px 1fr 1.45fr;gap:42px;align-items:center}
.portrait-wrap{position:relative}.portrait-wrap::before{content:"";position:absolute;inset:-8px;border:1px solid var(--gold);border-radius:18px;transform:translate(10px,10px)}
.portrait{position:relative;border-radius:14px;aspect-ratio:4/5;object-fit:cover;box-shadow:var(--shadow)}
.about-copy p{color:var(--muted)}
.creative-panel{background:var(--paper);padding:35px;border:1px solid var(--line);border-radius:20px;box-shadow:0 14px 40px rgba(45,45,45,.07)}
.creative-list{display:grid;gap:16px;margin-top:22px}.creative-item{display:flex;gap:14px}.creative-item b{color:#a67625}

.articles{
background:
  radial-gradient(circle at 88% 8%, rgba(214,187,127,.10), transparent 18%),
  linear-gradient(180deg,#efede8 0%, #f2efe9 100%)
}.articles-head{display:flex;justify-content:space-between;gap:25px;align-items:end;margin-bottom:32px}
.search-box{display:flex;align-items:center;background:white;border:1px solid #d7c7a7;border-radius:10px;padding:0 15px;width:min(360px,100%)}
.search-box input{border:0;outline:0;background:transparent;padding:14px;width:100%}
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.article{background:var(--paper);border:1px solid #ddd5ca;border-radius:15px;overflow:hidden;transition:.25s;box-shadow:0 10px 28px rgba(45,45,45,.06)}
.article:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.article-visual{height:165px;background:linear-gradient(135deg,#f8f4ea,#e9e4da);display:grid;place-items:center;color:var(--gold);font-size:66px}
.article-body{padding:24px}.tag{font-size:11px;color:#a67625;letter-spacing:.16em;text-transform:uppercase;font-weight:800}
.article h3{font-family:var(--serif);font-size:24px;line-height:1.25;margin:8px 0 12px}.meta{color:#858585;font-size:12px}

.values{background:var(--charcoal);color:white;padding:31px 0}.value-grid{display:grid;grid-template-columns:repeat(4,1fr)}
.value{padding:8px 25px;display:flex;gap:14px;align-items:center;border-right:1px solid rgba(228,199,125,.35)}
.value:last-child{border:0}.value span{font-size:28px;color:var(--gold)}.value b{display:block;font-family:var(--serif);font-size:18px;font-weight:500}.value small{color:#c6c6c6}

.footer{padding:35px 0;background:#24262a;color:#d5d5d5}.footer-inner{display:flex;justify-content:space-between;gap:20px;align-items:center}.footer a{color:var(--gold)}
.reveal{opacity:0;transform:translateY(22px);transition:.6s ease}.reveal.visible{opacity:1;transform:none}

@media(max-width:980px){
  .nav,.contact-btn{display:none}.menu-toggle{display:block}.nav.open{display:flex;position:absolute;top:86px;left:0;right:0;background:var(--paper);padding:20px;flex-direction:column;box-shadow:var(--shadow)}
  .nav.open a{padding:8px}.hero-grid{grid-template-columns:1fr}.hero-art{min-height:300px}.cards{grid-template-columns:repeat(2,1fr)}
  .about-grid{grid-template-columns:260px 1fr}.creative-panel{grid-column:1/-1}.article-grid{grid-template-columns:1fr 1fr}.value-grid{grid-template-columns:1fr 1fr}.value:nth-child(2){border-right:0}
}
@media(max-width:640px){
  .container{width:min(100% - 24px,1280px)}.header-inner{min-height:72px}.brand strong{font-size:18px}.brand small{font-size:8px}.monogram{font-size:35px}
  .hero{padding-top:45px}.hero h1{font-size:45px}.lead{font-size:17px}.hero-art{min-height:230px}
  .cards,.article-grid,.about-grid,.value-grid{grid-template-columns:1fr}.quick-links{margin-top:0}.about-grid{gap:28px}.portrait-wrap{max-width:300px;margin:auto}
  .articles-head{align-items:stretch;flex-direction:column}.value{border-right:0;border-bottom:1px solid rgba(228,199,125,.25)}.footer-inner{flex-direction:column;text-align:center}
}

/* Background ornaments tuned to the magnifying-glass visual */
.hero::after,
.page-hero::after{
  content:"";
  position:absolute;
  right:5%;
  top:10%;
  width:500px;
  height:500px;
  border-radius:50%;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.86) 0%, rgba(255,255,255,.40) 38%, rgba(255,255,255,0) 72%);
  pointer-events:none;
  filter: blur(0.5px);
  opacity:.98;
}
.hero-grid,
.page-hero-grid{
  position:relative;
  z-index:1;
}

.hero-art{
  position:relative;
}
.hero-art::before{
  content:"";
  position:absolute;
  inset:8% 3% 6% 18%;
  border-radius:34px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.38), rgba(223,225,228,.22)),
    radial-gradient(circle at 74% 26%, rgba(198,147,55,.18), transparent 22%);
  box-shadow: inset 0 0 0 1px rgba(205,170,98,.28);
  z-index:0;
}
.hero-art img{
  position:relative;
  z-index:1;
}

.section{
  position:relative;
}
.section::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 90% 20%, rgba(214,187,127,.06), transparent 16%);
  pointer-events:none;
}
.cards,
.about-grid,
.articles-head,
.article-grid{
  position:relative;
  z-index:1;
}

.article{
  background:
    linear-gradient(180deg, rgba(255,255,255,.94), rgba(249,247,243,.96));
}
.article-body{
  background:linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.78));
}

.search{
  background:linear-gradient(180deg, rgba(255,255,255,.98), rgba(250,248,244,.98));
}

.portrait-wrap::after{
  content:"";
  position:absolute;
  width:90px;
  height:90px;
  left:-28px;
  bottom:18px;
  background-image: radial-gradient(circle, rgba(198,147,55,.55) 1.3px, transparent 1.3px);
  background-size: 18px 18px;
  opacity:.35;
  pointer-events:none;
}

@media (max-width: 1000px){
  .hero::after,
  .page-hero::after{
    right:2%;
    width:260px;
    height:260px;
  }
  .hero-art::before{
    inset:6% 0 8% 6%;
  }
}


@media (max-width: 1000px){
  .hero-art{
    min-height:320px;
  }
  .hero-art::before{
    inset:6% 0 8% 4%;
    border-radius:28px;
  }
  .hero-art::after{
    width:120px;
    height:120px;
    right:2%;
  }
  .hero-art img{
    width:min(100%,560px);
    justify-self:center;
  }
}

@media (max-width: 640px){
  .hero-art{
    min-height:240px;
  }
  .hero-art::before{
    inset:4% 0 6% 0;
    border-radius:24px;
  }
  .hero-art img{
    width:min(100%,100%);
  }
}


/* ===== Premium animated career timeline ===== */
.career-journey{
  position:relative;
  overflow:hidden;
  padding:88px 0 96px;
  background:
    radial-gradient(circle at 18% 15%, rgba(198,147,55,.10), transparent 20%),
    radial-gradient(circle at 82% 78%, rgba(198,147,55,.08), transparent 22%),
    linear-gradient(180deg,#f8f6f2 0%,#efebe4 100%);
}
.career-journey::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:
    linear-gradient(rgba(198,147,55,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(198,147,55,.035) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,transparent,#000 16%,#000 84%,transparent);
}
.journey-heading{
  position:relative;
  z-index:1;
  display:grid;
  grid-template-columns:1fr .8fr;
  align-items:end;
  gap:42px;
  margin-bottom:26px;
}
.journey-heading > p{
  margin:0;
  color:var(--muted);
  font-size:17px;
}
.timeline-legend{
  position:relative;
  z-index:1;
  display:flex;
  gap:18px;
  flex-wrap:wrap;
  margin-bottom:38px;
  font-size:13px;
  color:#64676b;
}
.timeline-legend span{display:flex;align-items:center;gap:8px}
.legend-dot{
  width:12px;height:12px;border-radius:50%;display:inline-block;
  box-shadow:0 0 0 5px rgba(198,147,55,.08);
}
.legend-dot.work{background:#3e4146}
.legend-dot.study{background:var(--gold)}
.legend-dot.overlap{background:linear-gradient(135deg,#3e4146 0 50%,var(--gold) 50%)}

.career-timeline{
  position:relative;
  z-index:1;
  max-width:1120px;
  margin:auto;
  padding:8px 0;
}
.timeline-spine{
  position:absolute;
  left:50%;
  top:0;
  bottom:0;
  width:4px;
  transform:translateX(-50%);
  background:rgba(90,90,90,.12);
  border-radius:999px;
  overflow:hidden;
}
.timeline-progress{
  width:100%;
  height:0;
  background:linear-gradient(180deg,#e5c67b 0%,#c69337 60%,#7e5b24 100%);
  box-shadow:0 0 22px rgba(198,147,55,.55);
  transition:height .12s linear;
}
.career-event{
  position:relative;
  display:grid;
  grid-template-columns:1fr 72px 1fr;
  align-items:center;
  min-height:190px;
}
.career-event:nth-of-type(odd) .event-card{grid-column:1}
.career-event:nth-of-type(odd) .event-marker{grid-column:2}
.career-event:nth-of-type(even) .event-marker{grid-column:2}
.career-event:nth-of-type(even) .event-card{grid-column:3}
.event-marker{
  grid-row:1;
  width:58px;height:58px;
  border-radius:50%;
  display:grid;place-items:center;
  justify-self:center;
  position:relative;
  z-index:4;
  background:linear-gradient(145deg,#f9f7f1,#e9e2d5);
  border:2px solid var(--gold);
  box-shadow:0 10px 24px rgba(60,55,45,.16),0 0 0 8px rgba(198,147,55,.08);
  transition:.35s ease;
}
.event-marker span{
  font:700 12px/1 var(--sans);
  color:#8a641f;
}
.event-card{
  grid-row:1;
  position:relative;
  padding:25px 27px;
  border-radius:18px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(196,166,102,.34);
  box-shadow:0 16px 38px rgba(55,52,47,.08);
  backdrop-filter:blur(12px);
  transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease;
}
.career-event:nth-of-type(odd) .event-card{margin-right:34px}
.career-event:nth-of-type(even) .event-card{margin-left:34px}
.event-card::after{
  content:"";
  position:absolute;
  top:50%;
  width:34px;height:1px;
  background:linear-gradient(90deg,rgba(198,147,55,.75),rgba(198,147,55,.18));
}
.career-event:nth-of-type(odd) .event-card::after{right:-34px}
.career-event:nth-of-type(even) .event-card::after{left:-34px;transform:rotate(180deg)}
.event-card h3{
  margin:4px 0 5px;
  font:500 24px/1.2 var(--serif);
  color:#36383d;
}
.event-type{
  display:inline-flex;
  align-items:center;
  min-height:25px;
  padding:4px 10px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.13em;
  text-transform:uppercase;
  color:#78551b;
  background:rgba(229,198,123,.28);
}
.study-event .event-type{background:rgba(198,147,55,.18)}
.work-event .event-card{border-left:4px solid #3e4146}
.study-event .event-card{border-left:4px solid var(--gold)}
.overlap-event .event-card{
  background:
    linear-gradient(135deg,rgba(255,255,255,.92),rgba(246,239,225,.86));
  box-shadow:0 20px 44px rgba(106,82,36,.11);
}
.overlap-event .event-type::before{
  content:"";
  width:8px;height:8px;border-radius:50%;
  margin-right:7px;
  background:linear-gradient(135deg,#3e4146 0 50%,var(--gold) 50%);
}
.event-company{
  margin:0 0 9px;
  color:#9a712d;
  font-weight:750;
  font-size:13px;
}
.event-card > p:not(.event-company){margin:0;color:#5d6166;font-size:14px}
.event-tags{
  display:flex;gap:7px;flex-wrap:wrap;margin-top:15px;
}
.event-tags span{
  padding:4px 9px;border-radius:999px;
  background:#f0ece4;color:#706a60;
  font-size:10px;font-weight:800;
  border:1px solid rgba(198,147,55,.16);
}
.career-event:hover .event-card{
  transform:translateY(-6px) scale(1.012);
  box-shadow:0 24px 55px rgba(55,52,47,.15);
  border-color:rgba(198,147,55,.58);
}
.career-event:hover .event-marker{
  transform:scale(1.12);
  box-shadow:0 14px 30px rgba(60,55,45,.20),0 0 0 12px rgba(198,147,55,.11);
}
.career-event.is-active .event-marker{
  animation:timelinePulse 1.9s ease-in-out infinite;
}
@keyframes timelinePulse{
  0%,100%{box-shadow:0 10px 24px rgba(60,55,45,.16),0 0 0 8px rgba(198,147,55,.08)}
  50%{box-shadow:0 12px 28px rgba(60,55,45,.20),0 0 0 16px rgba(198,147,55,.03)}
}

@media(max-width:900px){
  .journey-heading{grid-template-columns:1fr}
  .career-timeline{padding-left:22px}
  .timeline-spine{left:28px}
  .career-event{
    grid-template-columns:62px 1fr;
    min-height:0;
    margin-bottom:24px;
  }
  .career-event .event-marker,
  .career-event:nth-of-type(odd) .event-marker,
  .career-event:nth-of-type(even) .event-marker{
    grid-column:1;
    grid-row:1;
  }
  .career-event .event-card,
  .career-event:nth-of-type(odd) .event-card,
  .career-event:nth-of-type(even) .event-card{
    grid-column:2;
    grid-row:1;
    margin:0 0 0 18px;
  }
  .career-event .event-card::after,
  .career-event:nth-of-type(odd) .event-card::after,
  .career-event:nth-of-type(even) .event-card::after{
    left:-18px;
    right:auto;
    width:18px;
    transform:none;
  }
}
@media(max-width:560px){
  .career-journey{padding:64px 0 72px}
  .timeline-legend{display:grid;gap:10px}
  .event-marker{width:48px;height:48px}
  .career-event{grid-template-columns:52px 1fr}
  .event-card{padding:21px 19px}
  .event-card h3{font-size:21px}
}


/* ===== Redesigned creative approach page ===== */
.creative-hero{position:relative;overflow:hidden;padding:76px 0 66px;background:radial-gradient(circle at 12% 14%,rgba(200,155,66,.13),transparent 25%),linear-gradient(135deg,#fbfaf7,#eee9e1)}
.creative-hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(200,155,66,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(200,155,66,.045) 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(90deg,#000,transparent 75%)}
.creative-hero-grid{position:relative;z-index:1;display:grid;grid-template-columns:.9fr 1.1fr;gap:54px;align-items:center}
.creative-hero h1,.articles-showcase h1{font:500 clamp(48px,5vw,76px)/1.04 var(--serif);margin:0 0 22px}
.creative-hero-lead,.articles-intro{font-size:19px;color:#55595e;max-width:650px}
.creative-hero-image,.articles-hero-visual,.article-detail-image{position:relative;border-radius:30px;overflow:hidden;border:1px solid rgba(200,155,66,.26);box-shadow:0 26px 55px rgba(67,57,43,.12)}
.interactive-visual img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .55s ease}
.interactive-visual::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.32) 50%,transparent 65%);transform:translateX(-130%);transition:transform .85s ease;pointer-events:none}
.interactive-visual:hover img{transform:scale(1.035);filter:saturate(1.03) contrast(1.02)}
.interactive-visual:hover::after{transform:translateX(130%)}
.creative-journey{position:relative;padding:92px 0 105px;background:linear-gradient(180deg,#f8f5ef,#eee9e1);overflow:hidden}
.creative-heading{max-width:850px;margin-bottom:48px}.creative-heading>p:last-child{color:var(--muted);font-size:17px}
.creative-path{position:relative;max-width:1050px;margin:auto;padding:14px 0}
.creative-path-line{position:absolute;left:50%;top:0;bottom:0;width:4px;transform:translateX(-50%);background:rgba(86,78,66,.12);border-radius:999px;overflow:hidden}
.creative-path-progress{width:100%;height:0;background:linear-gradient(180deg,#eed48f,#c89b42,#805a20);box-shadow:0 0 24px rgba(200,155,66,.48);transition:height .12s linear}
.creative-step{position:relative;display:grid;grid-template-columns:1fr 84px 1fr;align-items:center;min-height:185px}
.creative-step:nth-of-type(odd) .creative-step-card{grid-column:1;margin-right:38px}.creative-step:nth-of-type(even) .creative-step-card{grid-column:3;margin-left:38px}.creative-step-marker{grid-column:2;grid-row:1;justify-self:center;width:64px;height:64px;border-radius:50%;display:grid;place-items:center;z-index:3;background:linear-gradient(145deg,#fffdf8,#e9dfcf);border:2px solid var(--gold);box-shadow:0 12px 28px rgba(70,58,41,.15),0 0 0 9px rgba(200,155,66,.08);transition:.35s ease}.creative-step-marker span{font:600 24px/1 var(--serif);color:#8a611d}
.creative-step-card{grid-row:1;position:relative;padding:27px 30px;border-radius:21px;background:rgba(255,255,255,.82);border:1px solid rgba(200,155,66,.28);box-shadow:0 16px 38px rgba(60,54,46,.08);backdrop-filter:blur(10px);transition:.35s ease}
.creative-step-card::after{content:"";position:absolute;top:50%;width:38px;height:1px;background:var(--gold)}.creative-step:nth-of-type(odd) .creative-step-card::after{right:-38px}.creative-step:nth-of-type(even) .creative-step-card::after{left:-38px}
.creative-step-no{color:var(--gold);font-size:11px;letter-spacing:.2em;font-weight:900}.creative-step-card h2{font:500 28px/1.2 var(--serif);margin:5px 0 8px}.creative-step-card p{margin:0;color:#606368}
.creative-step:hover .creative-step-card,.creative-step.is-active .creative-step-card{transform:translateY(-6px);box-shadow:0 25px 55px rgba(60,54,46,.14);border-color:rgba(200,155,66,.58)}
.creative-step.is-active .creative-step-marker{animation:creativePulse 1.8s ease-in-out infinite}
@keyframes creativePulse{0%,100%{box-shadow:0 12px 28px rgba(70,58,41,.15),0 0 0 9px rgba(200,155,66,.08)}50%{box-shadow:0 15px 34px rgba(70,58,41,.2),0 0 0 18px rgba(200,155,66,.025)}}
.creative-applications{padding:82px 0;background:#292b2f;color:#fff}.creative-application-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.creative-use{position:relative;padding:34px;border-radius:20px;background:linear-gradient(145deg,#383a3f,#282a2e);border:1px solid rgba(228,199,125,.2);box-shadow:0 18px 38px rgba(0,0,0,.13);overflow:hidden;transition:.3s}.creative-use::after{content:"";position:absolute;inset:0;background:linear-gradient(120deg,transparent,rgba(255,255,255,.05),transparent);transform:translateX(-110%);transition:.6s}.creative-use:hover{transform:translateY(-7px)}.creative-use:hover::after{transform:translateX(110%)}.creative-use>span{color:var(--gold);font-size:11px;font-weight:900;letter-spacing:.18em}.creative-use h2{font:500 27px/1.2 var(--serif);margin:8px 0 18px}.creative-use ul{padding-left:19px;color:#d6d4d0}

/* ===== Professional article library ===== */
.articles-showcase{position:relative;overflow:hidden;padding:74px 0 68px;background:radial-gradient(circle at 12% 18%,rgba(200,155,66,.13),transparent 25%),linear-gradient(135deg,#fbfaf7,#eee9e1)}
.articles-showcase-grid{display:grid;grid-template-columns:.82fr 1.18fr;gap:54px;align-items:center}.articles-stat{display:flex;align-items:center;gap:15px;margin-top:28px}.articles-stat strong{font:500 54px/1 var(--serif);color:var(--gold)}.articles-stat span{font-size:13px;color:#65686d;border-left:1px solid rgba(200,155,66,.5);padding-left:15px}
.articles-library{padding:70px 0 92px;background:linear-gradient(180deg,#f7f4ee,#eeebe5)}
.article-toolbar{position:sticky;top:86px;z-index:10;margin-top:30px;margin-bottom:38px;padding:16px;border:1px solid rgba(200,155,66,.24);border-radius:16px;background:rgba(252,251,248,.91);backdrop-filter:blur(14px);box-shadow:0 12px 28px rgba(55,50,43,.07)}
.filters{display:flex;gap:8px;flex-wrap:wrap}.filter-btn{border:1px solid rgba(200,155,66,.3);border-radius:999px;padding:9px 13px;background:#fff;color:#575a5f;cursor:pointer;font-weight:700;font-size:12px;transition:.22s}.filter-btn:hover,.filter-btn.active{background:linear-gradient(135deg,var(--gold-light),var(--gold));color:#2c261b;transform:translateY(-1px)}
.article-pro-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.article-pro{background:rgba(255,255,255,.86);border:1px solid rgba(200,155,66,.24);border-radius:20px;overflow:hidden;box-shadow:0 14px 34px rgba(62,54,44,.075);transition:.35s ease}.article-pro:hover{transform:translateY(-8px);box-shadow:0 25px 55px rgba(62,54,44,.14);border-color:rgba(200,155,66,.55)}
.article-pro-image{position:relative;display:block;height:220px;overflow:hidden;background:#eee8df}.article-pro-image img{width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.2,.7,.2,1),filter .55s ease}.article-pro-image::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 35%,rgba(255,255,255,.34) 50%,transparent 65%);transform:translateX(-130%);transition:.85s}.article-pro:hover .article-pro-image img{transform:scale(1.075);filter:saturate(1.05) contrast(1.02)}.article-pro:hover .article-pro-image::after{transform:translateX(130%)}
.article-pro-number{position:absolute;left:14px;top:14px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(42,43,47,.82);color:#f1d68e;font-weight:900;font-size:11px;backdrop-filter:blur(8px);z-index:2}.article-pro-arrow{position:absolute;right:14px;top:14px;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.82);color:#8a621f;font-size:20px;transform:translateY(-60px);transition:.35s;z-index:2}.article-pro:hover .article-pro-arrow{transform:none}
.article-pro-body{padding:24px 25px 27px}.article-pro-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:11px;color:#85817a}.article-pro h2{font:500 25px/1.22 var(--serif);margin:10px 0 12px}.article-pro h2 a:hover{color:#956b25}.article-pro p{color:#62656a;font-size:14px;margin:0 0 20px}.article-read{display:inline-flex;gap:8px;align-items:center;color:#8c6422;font-weight:800;font-size:13px}.article-read span{transition:.25s}.article-read:hover span{transform:translateX(5px)}.article-pro[hidden]{display:none}.empty{display:none;text-align:center;padding:45px;color:#777}.empty.visible{display:block}
.article-detail-hero{padding:64px 0;background:linear-gradient(135deg,#fbfaf7,#eee9e1)}.article-detail-hero-grid{display:grid;grid-template-columns:1fr .78fr;gap:48px;align-items:center}.article-detail-hero h1{font:500 clamp(42px,4.5vw,68px)/1.07 var(--serif);margin:0 0 18px}.article-lead{font-size:18px;color:#5f6267}.article-detail-image{aspect-ratio:16/10}.article-new{max-width:880px}.article-new h2{margin-top:38px}.article-end-nav{margin-top:38px;padding-top:26px;border-top:1px solid var(--line)}

@media(max-width:1050px){.creative-hero-grid,.articles-showcase-grid,.article-detail-hero-grid{grid-template-columns:1fr}.creative-hero-image,.articles-hero-visual{max-width:800px}.article-pro-grid{grid-template-columns:repeat(2,1fr)}.creative-application-grid{grid-template-columns:1fr}.article-toolbar{position:relative;top:auto}}
@media(max-width:760px){.creative-path{padding-left:15px}.creative-path-line{left:29px}.creative-step{grid-template-columns:58px 1fr;min-height:0;margin-bottom:24px}.creative-step .creative-step-marker{grid-column:1}.creative-step .creative-step-card,.creative-step:nth-of-type(odd) .creative-step-card,.creative-step:nth-of-type(even) .creative-step-card{grid-column:2;margin-left:14px;margin-right:0}.creative-step-card::after,.creative-step:nth-of-type(odd) .creative-step-card::after,.creative-step:nth-of-type(even) .creative-step-card::after{left:-14px;right:auto;width:14px}.creative-step-marker{width:50px;height:50px}.article-pro-grid{grid-template-columns:1fr}.article-pro-image{height:230px}.articles-showcase,.creative-hero{padding-top:50px}.article-detail-hero{padding-top:42px}}
@media(prefers-reduced-motion:reduce){.interactive-visual img,.article-pro-image img,.creative-step-card,.creative-step-marker{transition:none}.creative-step.is-active .creative-step-marker{animation:none}}
/* === Expanded professional article content === */
.article-new{font-size:17px;line-height:1.78}
.article-new>p{color:#52565b}
.article-new h2{font:500 34px/1.2 var(--serif);margin-top:52px;margin-bottom:18px;color:#34363b}
.article-steps{display:grid;gap:18px;margin:24px 0 36px}
.article-step{display:grid;grid-template-columns:58px 1fr;gap:18px;padding:22px 24px;border-radius:18px;background:linear-gradient(145deg,rgba(255,255,255,.95),rgba(248,244,237,.92));border:1px solid rgba(200,155,66,.28);box-shadow:0 12px 28px rgba(54,47,38,.06);transition:.25s ease}
.article-step:hover{transform:translateY(-3px);border-color:rgba(200,155,66,.55);box-shadow:0 18px 36px rgba(54,47,38,.10)}
.article-step-no{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,var(--gold-light),var(--gold));color:#2b251c;font-weight:800;box-shadow:0 8px 20px rgba(200,155,66,.23)}
.article-step h3{font:500 23px/1.25 var(--serif);margin:1px 0 7px}.article-step p{margin:0;color:#5a5d62}
.article-pitfalls{padding:25px 28px;border-radius:18px;background:linear-gradient(145deg,#35373b,#292b2f);color:#f4f1eb;box-shadow:0 18px 40px rgba(35,35,35,.12)}
.article-pitfalls ul{margin:0;padding-left:22px}.article-pitfalls li{margin:10px 0}.article-pitfalls li::marker{color:var(--gold-light)}
.article-takeaway{margin:30px 0;padding:24px 28px;border-left:4px solid var(--gold);background:linear-gradient(135deg,rgba(228,199,125,.18),rgba(255,255,255,.8));border-radius:0 16px 16px 0;color:#4c4a46}
.article-lesson{display:flex;gap:20px;align-items:flex-start;margin:22px 0 28px;padding:28px;border-radius:20px;background:linear-gradient(135deg,#f4ead5,#fffdf8);border:1px solid rgba(200,155,66,.45);box-shadow:0 16px 34px rgba(72,57,34,.08)}
.article-lesson span{flex:0 0 52px;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(145deg,var(--gold-light),var(--gold));color:#2d261b;font-size:25px;font-weight:800}
.article-lesson p{margin:0;font:500 21px/1.55 var(--serif);color:#454039}
@media(max-width:640px){.article-new{font-size:16px}.article-new h2{font-size:29px}.article-step{grid-template-columns:44px 1fr;padding:18px 16px;gap:12px}.article-step-no{width:40px;height:40px}.article-step h3{font-size:20px}.article-lesson{padding:20px;gap:14px}.article-lesson span{width:44px;height:44px;flex-basis:44px}.article-lesson p{font-size:18px}}

/* Jemný „živý“ efekt portrétu – bez videa */
.portrait-wrap .portrait{
  transform-origin: 52% 44%;
  will-change: transform, filter;
  animation: portrait-soft-motion 9s ease-in-out infinite;
  transition: filter .35s ease;
}

.portrait-wrap:hover .portrait{
  filter: brightness(1.015) saturate(1.025) drop-shadow(0 16px 24px rgba(96,72,34,.12));
}

@keyframes portrait-soft-motion{
  0%,100%{
    transform: translate3d(0,0,0) scale(1);
  }
  22%{
    transform: translate3d(1px,-2px,0) scale(1.004) rotate(.08deg);
  }
  48%{
    transform: translate3d(-1px,-4px,0) scale(1.009) rotate(-.08deg);
  }
  72%{
    transform: translate3d(1px,-2px,0) scale(1.005) rotate(.05deg);
  }
}

@media (prefers-reduced-motion: reduce){
  .portrait-wrap .portrait{
    animation: none;
    transform: none;
  }
}


/* Animovaný portrét */
.portrait-wrap .portrait-video{
  display:block;
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center 35%;
  border:0;
  background:#292929;
  animation:none;
  transform:none;
}
.portrait-wrap:hover .portrait-video{
  transform:scale(1.008);
  filter:brightness(1.015) saturate(1.02) drop-shadow(0 16px 24px rgba(96,72,34,.12));
}
@media (prefers-reduced-motion: reduce){
  .portrait-wrap .portrait-video{
    transition:none;
    transform:none;
  }
}

/* === Přesná velikost animovaného portrétu === */
.portrait-wrap{
  width:100%;
  max-width:310px;
}
.portrait-wrap .portrait-video{
  width:100%;
  height:auto;
  aspect-ratio:4/5;
  object-fit:cover;
  object-position:center top;
}