:root{--ink:#263825;--green:#30492d;--muted:#505a4a;--cream:#f8f4ed;--sage:#e8e8da;--line:#d9dbcc;--gutter:clamp(1rem,4vw,5rem);--orange:#9e4a26;--serif:"Instrument Serif",Georgia,serif;--sans:"DM Sans",system-ui,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;color:var(--ink);background:var(--cream);font:1rem/1.65 var(--sans)}
a{color:inherit;text-underline-offset:.23em}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid #9d5746;outline-offset:4px}
img{max-width:100%;display:block}
h1,h2,h3,p{margin:0}
h1,h2,h3{font:400 2rem/1.05 var(--serif)}
h2{font-size:clamp(2.65rem,5vw,4.4rem);margin:.2em 0 .33em}
p+p{margin-top:.65em}
.wrap{width:calc(100% - 2 * var(--gutter));margin-inline:auto}
.top{border-bottom:1px solid var(--line)}
.header-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:1rem;position:relative}
.brand{display:flex;align-items:center;gap:.9rem;text-decoration:none;font:400 2rem/1 var(--serif)}
.brand small{display:block;margin-top:.36rem;font:500 .72rem/1.3 var(--sans)}
nav,.footer div{display:flex;flex-wrap:wrap;gap:clamp(.8rem,2.2vw,2rem)}
.footer-links{justify-content:flex-end}
nav a,.footer a{font-weight:600;text-decoration:none}
nav a:hover,.footer a:hover{text-decoration:underline}
.menu-toggle{display:none}
.hero{display:grid;grid-template-columns:1fr 1fr;min-height:clamp(520px,39vw,780px);position:relative;isolation:isolate;background:#f6e8d9}
.hero-copy{position:relative;z-index:1;align-self:center;padding:clamp(3rem,6vw,6rem) 0 clamp(3rem,6vw,6rem) var(--gutter)}
.eyebrow{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;color:var(--orange)}
h1{font-size:clamp(4.5rem,8.7vw,8.5rem);line-height:.86;margin:.18em 0 .26em}
h1 em{font-weight:400;color:#455338}
.hero-copy>p:not(.eyebrow,.location){max-width:38ch;font-size:1.15rem;color:var(--muted);margin-bottom:1.5rem}
.hero-media{display:contents}
.hero-photo{position:absolute;inset:0 0 0 auto;width:62%;height:100%;object-fit:cover;object-position:center}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#fbf4e9 0%,#f8e8d5 34%,#f7e8d7ed 44%,#f7e8d729 68%,transparent 84%);pointer-events:none}
.button,button{cursor:pointer;font:700 .96rem/1.3 var(--sans)}
.button{display:inline-flex;gap:.8rem;align-items:center;justify-content:center;border-radius:.65rem;padding:.86rem 1.2rem;background:linear-gradient(120deg,#244327,#46603c);color:white;text-decoration:none;border:1px solid #476245;box-shadow:0 6px 16px #29402a21}
.button:hover{background:linear-gradient(120deg,#213920,#365031)}
.outline{background:linear-gradient(120deg,#fff8f0,#f4e1cd);border-color:#a6623e;color:#743517;box-shadow:none}
.outline:hover{background:linear-gradient(120deg,#fff6e8,#efd4b9)}
.location{margin-top:1.1rem;color:var(--muted);font-size:.9rem}
.section{padding-block:clamp(3.5rem,7vw,7rem)}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:1.6rem}
.cards article,.report-card{border-radius:1rem;background:var(--sage);padding:clamp(1.25rem,3vw,2.3rem);border:1px solid var(--line)}
.cards article{background:linear-gradient(145deg,#fffdf8,#eeeee2);border:1px solid #ded9c8;box-shadow:0 12px 27px #4338210f;border-top:3px solid #c5794d;transition:box-shadow .2s,transform .2s}
.cards article:nth-child(2){background:linear-gradient(145deg,#fffaf2,#f2e3d0)}
.cards article:hover{box-shadow:0 16px 30px #4338211f;transform:translateY(-3px)}
.cards p,.split p:not(.eyebrow){margin:.8rem 0;color:var(--muted)}
.cards a{font-weight:700}
.icon{display:grid;place-items:center;border:1px solid #e2b591;border-radius:.95rem;width:3.75rem;height:3.75rem;background:linear-gradient(145deg,#fff8ed,#f0d6b7);color:var(--orange);margin-bottom:1.25rem}
.icon svg{width:2rem;height:2rem}
.about{background:#eeeee4}
.split{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:clamp(1.75rem,6vw,6rem)}
.portrait{width:100%;max-height:490px;object-fit:cover;object-position:center 35%;border-radius:1rem}
.matricula{font-weight:700}
.tags{padding:0;list-style:none;display:flex;gap:.5rem;flex-wrap:wrap}
.tags li{border:1px solid #bac4ae;border-radius:2rem;padding:.25rem .75rem}
.report-card h3{margin:.5rem 0}
.report-card li{border-bottom:1px solid #c3cdb9;padding:.65rem 0}
.report-card ul{padding:0;list-style:none}
.contact{background:linear-gradient(120deg,#263c28,#455838);color:#fff}
.contact .eyebrow{color:#e5eadc}
.contact .button{background:linear-gradient(120deg,#fff7e8,#edc49f);color:#46321e;margin-top:1rem}
.contact .button:hover{background:#e5eadc}
.footer{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding-block:1.8rem;font-size:.86rem}
.footer-links{align-items:baseline;column-gap:.8rem!important;row-gap:.4rem!important}
.footer-links a+a{border-left:1px solid #bca58e;padding-left:.8rem}
.footer-links a:hover{color:var(--orange)}
.social-fields{border:1px solid var(--line);border-radius:.7rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1rem;padding:1rem}
.social-fields legend{font-weight:700;padding-inline:.4rem}
#login-status,#logout{margin-top:1rem}
.skip{position:absolute;top:0;left:1rem;transform:translateY(-150%);background:white;padding:.4rem;z-index:2}
.skip:focus{transform:none}
.inner{max-width:770px}
table{width:100%;border-collapse:collapse;margin-block:1rem}
th,td{text-align:left;padding:.7rem;border-bottom:1px solid var(--line)}
.admin-form{display:grid;gap:1rem;margin-top:1.5rem}
.admin-form label{display:grid;gap:.25rem;font-weight:700}
.admin-form input{font:inherit;padding:.6rem;border:1px solid #9eac90;border-radius:.4rem}
.actions{display:flex;gap:.6rem;flex-wrap:wrap}
@media(max-width:760px){
  .wrap{width:calc(100% - 2rem)}
  .header-inner{flex-wrap:wrap}
  .brand{font-size:1.6rem}
  .brand img{width:36px;height:36px}
  .menu-toggle:not([hidden]){display:block;padding:.45rem .6rem;background:transparent;border:1px solid #819277;color:var(--green);border-radius:.4rem}
  nav{width:100%;padding-bottom:.75rem}
  .menu-toggle:not([hidden])[aria-expanded=false]+nav{display:none}
  .hero,.split,.cards{grid-template-columns:1fr}
  .hero{min-height:0}
  .hero-copy{padding:2.7rem 1rem 1.5rem;background:linear-gradient(145deg,#fbf4e9,#f6e2cc)}
  .hero-photo{position:relative;width:100%;height:auto;aspect-ratio:1.6}
  .hero::after{display:none}
  .portrait{max-height:425px}
  .footer{flex-direction:column}
  h1{font-size:clamp(3.5rem,11vw,5.5rem)}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.cards article{transition:none}.cards article:hover{transform:none}}

/* Shared palette tokens for the public page and its preset themes. */
:root {
  --gutter:clamp(1rem,2.8vw,3.5rem);
  --hero-light:#fff2dc;
  --hero-warm:#edb783;
  --button-start:#a34121;
  --button-end:#763116;
  --accent-border:#cd8256;
}
:root[data-theme="terracota"] {
  --ink:#492b20; --cream:#fff7ef; --orange:#9e411e;
  --hero-light:#fff0e2; --hero-warm:#e8a283; --button-start:#a5482c; --button-end:#763322;
}
:root[data-theme="salvia"] {
  --ink:#263825; --cream:#f4f5eb; --orange:#815233;
  --hero-light:#f0f4de; --hero-warm:#c3cc99; --button-start:#406340; --button-end:#29452b;
}
.hero{grid-template-columns: minmax(0,54%) 1fr}
.hero::after {
  background:linear-gradient(105deg,var(--hero-light) 4%,var(--hero-warm) 40%,color-mix(in srgb,var(--hero-warm) 85%,transparent) 50%,transparent 77%);
}
.hero-copy{padding-right:1rem}
.hero-copy h1{overflow-wrap:anywhere}
.hero-photo{width:68%;object-position:65% center}
.hero-copy .eyebrow{display:flex;align-items:center;gap:.7rem}
.hero-copy .eyebrow::before{content:"";width:2.2rem;height:2px;background:var(--button-start)}
.hero-copy>p:not(.eyebrow,.location){color:#374330}
.button {
  border-radius:.8rem;
  border-color:transparent;
  background:linear-gradient(122deg,var(--button-start),var(--button-end));
  box-shadow:0 6px 15px #56251229,inset 0 1px #ffffff33;
  min-height:46px;
}
.button:hover{background:linear-gradient(122deg,var(--button-end),var(--button-start))}
.button span{display:grid;place-items:center;width:1.65rem;height:1.65rem;border:1px solid #ffffff6e;border-radius:50%;flex:none}
.outline{background:linear-gradient(122deg,#fffbf6,#f3dac3);border-color:#aa6946;box-shadow:none}
.outline:hover{background:linear-gradient(122deg,#fff8ec,#efcfb2)}
.outline span{border-color:#aa6946}
.cards{gap:clamp(.8rem,1.6vw,2rem)}
.cards article {
  border:1px solid #dfc4a8;
  border-radius:1.3rem;
  background:linear-gradient(155deg,#fffcf6,#f5e8d8);
  padding:clamp(.65rem,1.05vw,1rem);
}
.cards article h3,.cards article p,.cards article a{margin-inline:clamp(.3rem,1.15vw,1.35rem)}
.cards article h3{margin-top:1.25rem}
.cards article p{margin-bottom:1.25rem}
.cards article a{display:inline-block;color:var(--orange);margin-bottom:.8rem}
.service-photo{width:100%;height:auto;border-radius:.9rem;border:1px solid #e0bb9b}
.portrait{border:1px solid #d8b597;border-radius:1.4rem;box-shadow:0 14px 34px #4737211c}
.report-card{border-color:#dab492;background:linear-gradient(145deg,#fff8ec,#f2dfc7)}
.dashboard{max-width:1120px}
.admin-login{max-width:440px;margin:2rem auto;padding:clamp(1.2rem,4vw,2.5rem);background:#fffcf7;border:1px solid #dfc4a8;border-radius:1.2rem}
.admin-form details{background:#fffcf7;border:1px solid #dfc4a8;border-radius:.85rem}
.admin-form summary{cursor:pointer;font-weight:700;padding:1rem;color:var(--orange)}
.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:0 1rem 1rem}
.field-grid .full{grid-column:1/-1}
.admin-form textarea,.admin-form select{font:inherit;padding:.6rem;border:1px solid #aab49e;border-radius:.4rem;background:#fff}
.admin-form textarea{min-height:5rem;resize:vertical}
.admin-form input{width:100%;min-width:0}
.cover-preview img{width:min(100%,350px);aspect-ratio:2;object-fit:cover;border-radius:.6rem;margin-bottom:.5rem}
@media(max-width:760px){
  .hero,.field-grid{grid-template-columns:1fr}
  .hero-copy{background:linear-gradient(to bottom,var(--hero-light),var(--hero-warm))}
  .hero-media{display:block;position:relative}
  .hero-photo{width:100%}
  .hero-media::after{
    content:"";
    position:absolute;
    inset:0 0 auto;
    height:30%;
    background:linear-gradient(to bottom,var(--hero-warm),transparent);
    pointer-events:none;
  }
}

.brand {font-family:var(--sans);font-size:1.55rem;font-weight:650;letter-spacing:-.025em}
.brand small {letter-spacing:.09em;text-transform:uppercase}
.brand .brand-registration {letter-spacing:.025em;margin-top:.2rem}
.report-preview {margin:0;max-width:540px;width:100%;justify-self:center;padding:clamp(.55rem,1.5vw,1.15rem)}
.report-preview a {display:block;border-radius:.65rem;overflow:hidden}
.report-preview img,.report-full {display:block;width:100%;height:auto}
.report-preview figcaption {margin:.6rem .25rem 0;color:var(--muted);font-size:.9rem}
.report-full {max-width:640px;margin-top:1.5rem;border:1px solid var(--line);border-radius:.65rem}
@media(max-width:760px){.brand{font-size:clamp(1.03rem,4.9vw,1.4rem)}.brand small{font-size:.65rem}}

.about {
  background:
    linear-gradient(90deg, #283e32aa 0%, #354c39aa 31%, #eeeee4f0 53%, #eeeee4 74%),
    #eeeee4 url("assets/portada.webp") center 64% / cover no-repeat;
}
.about .section {
  padding-block: 0;
}
.about .portrait {
  display: block;
  align-self: end;
  justify-self: center;
  width: min(100%, 26rem);
  height: auto;
  max-height: none;
  object-fit: contain;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  filter: drop-shadow(0 12px 20px #17291c55);
}
.about .split > div {
  padding-block: clamp(2.5rem, 6vw, 6rem);
}
.about-photo { display: contents; }

@media (max-width: 760px) {
  .about { background: #eeeee4; }
  .about .split { gap: 0; }
  .about-photo {
    display: grid;
    justify-items: center;
    margin: 0 -1rem;
    background:
      linear-gradient(to bottom, #283e3277 0%, #354c3966 42%, #eeeee4a8 75%, #eeeee4 100%),
      url("assets/portada.webp") center / cover no-repeat;
  }
  .about .portrait {
    width: min(82%, 17rem);
    filter: none;
    mask-image: linear-gradient(to bottom, #000 68%, #000c 81%, #0000 100%);
  }
  .about .split > div { padding-block: 1.25rem 3rem; }
  .footer-links { width: 100%; justify-content: flex-start; }
  .footer-links .footer-credit {
    flex-basis: 100%;
    border-left: 0;
    padding-left: 0;
    margin-top: .4rem;
    text-align: right;
  }
}

.top .brand {
  display: grid;
  gap: .14rem;
  flex-shrink: 0;
  width: clamp(11.25rem, 44vw, 19rem);
  padding-block: .38rem;
}
.brand-logo {
  display: block;
  position: relative;
  overflow: hidden;
  aspect-ratio: 1250 / 260;
}
.top .brand-logo img {
  position: absolute;
  inset: 0 auto auto 0;
  width: 122.88%;
  max-width: none;
  height: auto;
  transform: translate(-9.765625%, -35.644531%);
}
.top .brand-registration {
  margin: 0 0 0 27%;
}
