/* ============ TOKENS ============ */
:root{
  --ink:        #12140F;
  --ink-soft:   #1D211A;
  --bone:       #EDE9DD;
  --bone-dim:   #C9C4B4;
  --signal:     #FF4A23;
  --signal-dim: #B8371A;
  --clinical:   #9FB8AE;

  --display: "Big Shoulders Display", sans-serif;
  --body:    "Inter", sans-serif;
  --mono:    "IBM Plex Mono", monospace;

  --container: 1240px;
  --edge: clamp(20px, 5vw, 64px);
}

*{ margin:0; padding:0; box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  background:var(--bone);
  color:var(--ink);
  font-family:var(--body);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
::selection{ background:var(--signal); color:var(--bone); }
:focus-visible{ outline:2px solid var(--signal); outline-offset:3px; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important; }
}

/* ============ NAV ============ */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px var(--edge) 14px;
  mix-blend-mode:difference;
}
.nav__logo{
  font-family:var(--display); font-weight:700; font-size:20px;
  letter-spacing:0.02em; color:var(--bone);
}
.nav__logo span{ color:var(--clinical); }
.nav__links{ display:flex; gap:32px; }
.nav__links a{
  font-family:var(--mono); font-size:12px; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--bone);
  position:relative; padding-bottom:4px;
}
.nav__links a::after{
  content:""; position:absolute; left:0; bottom:0; width:0; height:1px;
  background:var(--bone); transition:width 0.25s ease;
}
.nav__links a:hover::after{ width:100%; }
.nav__cta{
  font-family:var(--mono); font-size:12px; letter-spacing:0.06em;
  text-transform:uppercase; color:var(--bone); background:transparent;
  border:1px solid var(--bone); padding:9px 18px; border-radius:999px;
  cursor:pointer; transition:background 0.25s ease, color 0.25s ease;
}
.nav__cta:hover{ background:var(--bone); color:var(--ink); }
.nav__burger{ display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; z-index:101; }
.nav__burger span{ width:24px; height:2px; background:var(--bone); }

@media (max-width:860px){
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{ display:flex; }

  .nav.nav--open{ mix-blend-mode:normal; }
  .nav.nav--open .nav__cta{ display:inline-flex; }
  .nav.nav--open .nav__links{
    display:flex; flex-direction:column;
    position:fixed; top:70px; left:0; right:0;
    background:var(--ink);
    padding:24px var(--edge); gap:20px;
    mix-blend-mode:normal;
  }
  .nav.nav--open .nav__links a{ color:var(--signal); }
  .nav.nav--open .nav__links a::after{ background:var(--signal); }
}

/* ============ HERO ============ */
.hero{
  position:relative; min-height:100svh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:0 var(--edge) 64px;
  overflow:hidden;
  background:var(--ink);
}
.hero__bg{ position:absolute; inset:0; }
.hero__bg img{
  width:100%; height:100%; object-fit:cover; object-position:center 20%;
  filter:grayscale(0.5) contrast(1.1);
  opacity:0.55;
}
.hero__bg::after{ content:""; }
.hero__grid{
  position:absolute; inset:0;
  background-image:
    linear-gradient(to right, rgba(237,233,221,0.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(237,233,221,0.06) 1px, transparent 1px);
  background-size:64px 64px;
}
.hero::before{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(18,20,15,0.2) 0%, rgba(18,20,15,0.95) 88%);
  z-index:1;
}
.hero__content{ position:relative; z-index:2; max-width:820px; }
.eyebrow{
  font-family:var(--mono); font-size:12px; letter-spacing:0.14em;
  color:var(--clinical); margin-bottom:18px;
}
.hero__title{
  font-family:var(--display); font-weight:800; text-transform:uppercase;
  font-size:clamp(58px, 12vw, 148px); line-height:0.86; color:var(--bone);
  letter-spacing:-0.01em;
}
.hero__title--outline{
  -webkit-text-stroke:2px var(--signal); color:transparent;
}
.hero__sub{
  font-family:var(--display); font-weight:600; font-size:clamp(20px,2.6vw,28px);
  color:var(--signal); margin:22px 0 14px; text-transform:uppercase;
}
.hero__desc{ color:var(--bone-dim); max-width:560px; font-size:16px; }
.hero__desc strong{ color:var(--bone); }
.hero__actions{ display:flex; gap:16px; margin-top:34px; flex-wrap:wrap; }
.hero__scroll{
  position:absolute; bottom:26px; right:var(--edge); z-index:2;
  font-family:var(--mono); font-size:11px; letter-spacing:0.14em;
  color:var(--bone-dim); writing-mode:vertical-rl;
  display:flex; align-items:center; gap:8px;
}
.hero__scroll span{ animation:bob 1.6s ease-in-out infinite; writing-mode:horizontal-tb; }
@keyframes bob{ 0%,100%{ transform:translateY(0);} 50%{ transform:translateY(4px);} }

/* Buttons */
.btn{
  display:inline-flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:13px; letter-spacing:0.06em; text-transform:uppercase;
  padding:15px 28px; border-radius:999px; border:none; cursor:pointer;
  transition:transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}
.btn--solid{ background:var(--signal); color:var(--bone); }
.btn--solid:hover{ background:var(--signal-dim); transform:translateY(-2px); }
.btn--ghost{ border:1px solid var(--bone-dim); color:var(--bone); }
.btn--ghost:hover{ border-color:var(--bone); transform:translateY(-2px); }
.btn--outline-dark{
  margin-top:44px; border:1px solid var(--ink); color:var(--ink);
  display:inline-flex;
}
.btn--outline-dark:hover{ background:var(--ink); color:var(--bone); }

/* ============ STATEMENT ============ */
.statement{
  background:var(--ink);
  padding:120px var(--edge) 100px; text-align:center;
}
.statement__text, .statement__note{ max-width:920px; margin-left:auto; margin-right:auto; }
.statement__text{
  font-family:var(--display); font-weight:600; font-size:clamp(26px,4vw,44px);
  line-height:1.25; letter-spacing:-0.005em; color:var(--bone);
}
.statement__text em{ font-style:normal; color:var(--signal); }
.statement__note{ color:var(--bone-dim); font-size:14px; margin-top:18px; }

.statement__videos{
  display:flex; justify-content:center; gap:20px; margin-top:56px; flex-wrap:nowrap;
}
.statement__video-card{
  width:clamp(96px, 26vw, 220px);
  aspect-ratio:9/16;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(237,233,221,0.15);
  box-shadow:0 12px 32px rgba(0,0,0,0.35);
  background:#000;
}
.statement__video-card video{
  width:100%; height:100%; object-fit:cover;
}

@media (max-width:600px){
  .statement__videos{ gap:10px; }
}

/* ============ SECTION HEADERS ============ */
.section-tag{
  font-family:var(--mono); font-size:12px; letter-spacing:0.12em;
  color:var(--signal); margin-bottom:14px;
}
.section-tag--light{ color:var(--signal); }
.section-title{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:clamp(34px,5vw,56px); margin-bottom:48px; letter-spacing:-0.01em;
}

/* ============ CROHN ============ */
.crohn{ max-width:var(--container); margin:0 auto; padding:60px var(--edge) 100px; }
.crohn__title{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:clamp(30px,4.5vw,50px); max-width:820px; margin-bottom:56px; letter-spacing:-0.01em;
}
.crohn__grid{ display:grid; grid-template-columns:1fr 1fr; gap:48px; margin-bottom:40px; }
.crohn__col h3{
  font-family:var(--mono); font-size:13px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--signal); margin-bottom:14px;
}
.crohn__col p{ font-size:15.5px; color:#333127; line-height:1.65; }
.crohn__disclaimer{
  font-family:var(--mono); font-size:12.5px; color:#6B6A60;
  border-left:2px solid var(--clinical); padding-left:16px; max-width:640px;
}
@media (max-width:760px){
  .crohn__grid{ grid-template-columns:1fr; }
}

/* ============ SERVICES ============ */
.services{ max-width:var(--container); margin:0 auto; padding:60px var(--edge) 120px; }
.services__grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:rgba(18,20,15,0.12); border:1px solid rgba(18,20,15,0.12);
}
.service-card{
  background:var(--bone); padding:38px 30px; position:relative;
}
.service-card--accent{ background:var(--ink); color:var(--bone); }
.service-card__tag{
  font-family:var(--mono); font-size:11px; letter-spacing:0.1em;
  color:var(--signal); margin-bottom:16px;
}
.service-card h3{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:26px; margin-bottom:6px;
}
.service-card__sub{ font-size:13px; color:#6B6A60; margin-bottom:18px; }
.service-card--accent .service-card__sub{ color:var(--bone-dim); }
.service-card ul{ display:flex; flex-direction:column; gap:10px; margin-top:16px; }
.service-card li{
  font-size:14.5px; padding-left:18px; position:relative; color:#333127;
}
.service-card--accent li{ color:var(--bone-dim); }
.service-card li::before{
  content:"–"; position:absolute; left:0; color:var(--signal);
}

@media (max-width:860px){
  .services__grid{ grid-template-columns:1fr; }
}

/* ============ RTP ============ */
.rtp{
  background:var(--ink); color:var(--bone);
  display:grid; grid-template-columns:1fr 1fr; align-items:stretch;
}
.rtp__media{ position:relative; min-height:420px; overflow:hidden; }
.rtp__media img{ width:100%; height:100%; object-fit:cover; }
.rtp__content{ padding:100px var(--edge); max-width:640px; }
.rtp__title{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:clamp(30px,4vw,44px); line-height:1.08; margin-bottom:20px;
}
.rtp__lead{ color:var(--signal); font-weight:600; margin-bottom:20px; font-size:17px; }
.rtp__content p{ color:var(--bone-dim); margin-bottom:16px; font-size:15px; }
.rtp__list{ margin:24px 0 32px; display:flex; flex-direction:column; gap:12px; }
.rtp__list li{
  font-size:14.5px; padding-left:22px; position:relative; color:var(--bone);
}
.rtp__list li::before{
  content:"→"; position:absolute; left:0; color:var(--clinical);
}

@media (max-width:860px){
  .rtp{ grid-template-columns:1fr; }
  .rtp__media{ min-height:320px; }
  .rtp__content{ padding:60px var(--edge); }
}

/* ============ TESTIMONIALS ============ */
.testimonials{ padding:120px 0; }
.testimonials .section-tag, .testimonials .section-title{ padding-left:var(--edge); }
.testimonials__sub{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:24px; padding-left:var(--edge); margin:70px 0 32px;
}
.testi-track{
  display:flex; gap:20px; overflow-x:auto; padding:0 var(--edge) 20px;
  scroll-snap-type:x proximity;
}
.testi-track::-webkit-scrollbar{ height:4px; }
.testi-track::-webkit-scrollbar-thumb{ background:var(--bone-dim); }
.testi-card{
  flex:0 0 320px; background:#fff; border:1px solid rgba(18,20,15,0.1);
  scroll-snap-align:start; display:flex; flex-direction:column;
}
.testi-card img{ width:100%; height:200px; object-fit:cover; filter:grayscale(0.3); }
.testi-card blockquote{
  padding:22px 22px 0; font-size:14.5px; line-height:1.55; color:#2B2A22; flex:1;
}
.testi-name{
  font-family:var(--mono); font-size:12.5px; font-weight:500;
  padding:18px 22px 0; letter-spacing:0.02em;
}
.testi-role{
  font-family:var(--mono); font-size:11px; color:var(--signal);
  padding:4px 22px 22px; letter-spacing:0.04em;
}

/* ============ CONTACT ============ */
.contact{ background:var(--ink); color:var(--bone); padding:130px var(--edge) 90px; }
.contact__inner{ max-width:680px; margin:0 auto; text-align:center; }
.contact__title{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:clamp(30px,4.5vw,46px); line-height:1.1; margin-bottom:60px;
}
.newsletter__label{ font-family:var(--mono); font-size:13px; letter-spacing:0.06em; text-transform:uppercase; color:var(--clinical); margin-bottom:10px; }
.newsletter__desc{ color:var(--bone-dim); font-size:14px; margin-bottom:26px; }
.newsletter__row{ display:flex; gap:0; max-width:420px; margin:0 auto; border:1px solid var(--bone-dim); border-radius:999px; overflow:hidden; }
.newsletter__row input{
  flex:1; background:transparent; border:none; padding:15px 20px; color:var(--bone);
  font-family:var(--body); font-size:14px;
}
.newsletter__row input::placeholder{ color:#7C7A6E; }
.newsletter__row input:focus{ outline:none; }
.newsletter__row button{
  background:var(--signal); border:none; color:var(--bone); padding:0 26px;
  font-family:var(--mono); font-size:12.5px; text-transform:uppercase; letter-spacing:0.05em;
  cursor:pointer; transition:background 0.2s ease;
}
.newsletter__row button:hover{ background:var(--signal-dim); }
.newsletter__thanks{
  margin-top:16px; font-family:var(--mono); font-size:13px; color:var(--clinical);
  opacity:0; transition:opacity 0.3s ease;
}
.newsletter__thanks.show{ opacity:1; }

/* ============ FOOTER ============ */
.footer{
  background:var(--ink); color:var(--bone-dim); padding:30px var(--edge) 40px;
  display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;
  border-top:1px solid rgba(237,233,221,0.12);
}
.footer__logo{ font-family:var(--display); font-weight:700; color:var(--bone); letter-spacing:0.02em; }
.footer__links{ display:flex; gap:24px; font-family:var(--mono); font-size:12px; text-transform:uppercase; letter-spacing:0.05em; }
.footer__links a:hover{ color:var(--bone); }
.footer__email{ font-family:var(--mono); font-size:12.5px; }
.footer__email:hover{ color:var(--signal); }

@media (max-width:600px){
  .footer{ flex-direction:column; text-align:center; }
}

/* ============ MODAL / POP-UP FORM ============ */
.hidden-field{ position:absolute; left:-9999px; }
.modal-overlay{
  position:fixed; inset:0; background:rgba(18,20,15,0.72);
  display:flex; align-items:center; justify-content:center;
  padding:24px; z-index:300; opacity:0; visibility:hidden;
  transition:opacity 0.25s ease, visibility 0.25s ease;
}
.modal-overlay.open{ opacity:1; visibility:visible; }
.modal{
  background:var(--bone); color:var(--ink); width:100%; max-width:520px;
  max-height:88vh; overflow-y:auto; border-radius:14px; padding:38px 34px;
  position:relative; transform:translateY(16px); transition:transform 0.25s ease;
}
.modal-overlay.open .modal{ transform:translateY(0); }
.modal__close{
  position:absolute; top:16px; right:16px; background:none; border:none;
  font-size:18px; cursor:pointer; color:var(--ink); width:32px; height:32px;
  border-radius:50%; transition:background 0.2s ease;
}
.modal__close:hover{ background:rgba(18,20,15,0.08); }
.modal h3{
  font-family:var(--display); font-weight:700; text-transform:uppercase;
  font-size:26px; margin-bottom:6px; padding-right:30px;
}
.modal__sub{ font-size:14px; color:#6B6A60; margin-bottom:26px; }
.field{ display:flex; flex-direction:column; gap:6px; margin-bottom:18px; }
.field span, .field legend{
  font-family:var(--mono); font-size:11.5px; letter-spacing:0.06em;
  text-transform:uppercase; color:#6B6A60;
}
.field input[type="text"], .field input[type="email"], .field input[type="tel"], .field textarea{
  font-family:var(--body); font-size:14.5px; padding:12px 14px;
  border:1px solid rgba(18,20,15,0.2); border-radius:8px; background:#fff; color:var(--ink);
  resize:vertical;
}
.field input:focus, .field textarea:focus{ outline:2px solid var(--signal); outline-offset:1px; }
.field--radio{ border:none; padding:0; }
.field--radio legend{ margin-bottom:8px; }
.field--radio label{
  display:inline-flex; align-items:center; gap:6px; margin-right:18px;
  font-family:var(--body); font-size:14px; text-transform:none; letter-spacing:0; color:var(--ink);
}
.modal__submit{ width:100%; justify-content:center; margin-top:6px; }
.modal__thanks, .modal__error{
  margin-top:14px; font-family:var(--mono); font-size:13px; text-align:center;
  display:none;
}
.modal__thanks{ color:#2E7D4F; }
.modal__error{ color:var(--signal); }
.modal__thanks.show, .modal__error.show{ display:block; }

@media (max-width:480px){
  .modal{ padding:30px 22px; }
}

/* ============ SIN LÍMITES ============ */
.no-limits{ max-width:var(--container); margin:0 auto; padding:120px var(--edge); text-align:center; }
.no-limits .section-tag, .no-limits .section-title{ text-align:center; }
.no-limits__lead{ color:#6B6A60; font-size:16px; max-width:520px; margin:-24px auto 48px; }
.no-limits__grid{ display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:20px; }
.no-limits__item{ margin:0; }
.no-limits__photo{
  aspect-ratio:4/5; border-radius:4px; overflow:hidden; background:#DDD8C8;
  display:flex; align-items:center; justify-content:center; position:relative;
  border:1px dashed var(--bone-dim);
}
.no-limits__photo img{ width:100%; height:100%; object-fit:cover; }
.no-limits__placeholder{
  font-family:var(--mono); font-size:12.5px; color:#6B6A60; padding:0 16px; text-align:center;
}
.no-limits__item figcaption{
  font-family:var(--mono); font-size:12px; letter-spacing:0.1em; text-transform:uppercase;
  color:var(--signal); margin-top:14px;
}

@media (max-width:760px){
  .no-limits__grid{ grid-template-columns:repeat(2,1fr); max-width:520px; margin:0 auto; }
}