@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,500;0,600;0,700;1,500;1,600&display=swap');
:root{--paper:#fffcf6;--ink:#243b2d;--green:#173e2c;--red:#c92732;--gold:#f4c548;--line:#dfdfd2;--muted:#636b5e;--serif:'Playfair Display',Georgia,serif;--sans:'DM Sans',Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:1rem;line-height:1.6}a{color:inherit;text-decoration:none}img{max-width:100%;display:block}button,a{-webkit-tap-highlight-color:transparent}a:focus-visible{outline:3px solid var(--red);outline-offset:6px}a:hover{text-decoration:underline;text-underline-offset:5px}.section{width:min(1280px,calc(100% - 112px));margin-inline:auto}.skip{position:fixed;left:20px;top:-100px;background:white;padding:12px;z-index:20}.skip:focus{top:10px}.topbar{background:var(--green);color:white;text-align:center;font-size:.75rem;font-weight:600;letter-spacing:.13em;padding:10px 20px}.topbar span{color:var(--gold);padding:0 25px}.header{width:min(1360px,calc(100% - 80px));margin:auto;padding:22px 0;display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:14px;flex-shrink:0}.brand>span{font-size:.75rem;line-height:1.25;letter-spacing:.15em;font-weight:600}.brand strong{display:block;font-family:var(--serif);font-size:1.75rem;letter-spacing:-.03em;font-weight:700}.header nav{display:flex;align-items:center;gap:38px;font-size:.9rem;font-weight:600}.nav-cta{padding:12px 20px;border:1px solid #c6cabb;border-radius:4px}.nav-cta span{margin-left:20px}.hero{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:center;padding-top:68px;padding-bottom:76px}.eyebrow{font-size:.75rem;font-weight:700;letter-spacing:.14em;line-height:1.6;margin:0 0 22px}.short-rule{display:inline-block;height:1px;width:24px;background:var(--red);vertical-align:middle;margin-right:10px}h1,h2,h3,h4,p{margin-top:0}h1,h2{font-family:var(--serif);font-weight:500;line-height:1.08;letter-spacing:-.04em}h1{font-size:clamp(3.4rem,5.2vw,5.25rem);margin-bottom:28px}h1 em,h2 em{font-weight:500;color:var(--red)}.intro{color:var(--muted);font-size:1.0625rem;max-width:430px;margin-bottom:30px;line-height:1.8}.hero-actions{display:flex;align-items:center;flex-wrap:wrap;gap:22px}.button{display:inline-flex;align-items:center;justify-content:center;gap:22px;font-size:.875rem;font-weight:600;padding:16px 20px;border-radius:4px;line-height:1.5;transition:background .2s,transform .2s}.button:hover{text-decoration:none;transform:translateY(-2px)}.primary{background:var(--red);color:#fff}.primary:hover{background:#a91e28}.text-link{font-size:.875rem;font-weight:600}.text-link span{margin-left:8px}.hero-note{display:flex;gap:17px;align-items:center;margin-top:36px}.note-number{font-family:var(--serif);font-size:2.1rem;line-height:1;border-right:1px solid #d3d5c8;padding-right:17px}.hero-note>span:last-child{font-size:.8125rem;line-height:1.5;color:var(--muted)}.hero-visual{position:relative;padding:0 0 29px 0}.hero-photo{height:570px;border-radius:180px 180px 8px 8px;overflow:hidden;background:#9c602c}.hero-photo img{width:100%;height:100%;object-fit:cover;object-position:75% center}.photo-label{position:absolute;left:-25px;bottom:69px;padding:22px 27px;background:var(--gold);transform:rotate(-4deg);box-shadow:3px 8px 0 #173e2c14}.photo-label>span{display:block;font-size:.75rem;font-weight:700;letter-spacing:.14em}.photo-label strong{font-family:var(--serif);font-size:1.45rem;font-style:italic;font-weight:500}.photo-index{display:block;text-align:right;font-size:.75rem;letter-spacing:.1em;margin-top:14px}.brand-ribbon{background:var(--red);color:#fff;display:flex;justify-content:space-around;align-items:center;gap:20px;padding:23px 40px;font-family:var(--serif);font-size:1.5rem}.brand-ribbon i{font-size:1.25rem;color:#ffe6a3;font-style:normal}.products{padding-block:96px}.section-heading{display:grid;grid-template-columns:1.4fr 1fr;gap:70px;align-items:end;margin-bottom:42px}h2{font-size:clamp(2.5rem,3.5vw,3.5rem);margin-bottom:0}.section-heading>p{max-width:360px;margin:0 0 4px;color:var(--muted);line-height:1.8}.product-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}.product-image{height:390px;position:relative;overflow:hidden;border-radius:5px}.product-image>img{width:100%;height:100%;object-fit:cover;object-position:72% center;transition:transform .5s}.product-card:hover .product-image>img{transform:scale(1.025)}.product-image>img.red-bread{object-position:center 34%}.image-tag{position:absolute;bottom:17px;left:18px;background:var(--paper);padding:6px 10px;font-size:.75rem;letter-spacing:.08em;font-weight:600}.product-caption{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:23px 0;border-bottom:1px solid var(--line)}.product-type{font-size:.75rem;letter-spacing:.13em;color:var(--red);font-weight:700}.product-caption h3{font-family:var(--serif);font-size:1.7rem;font-weight:500;margin:5px 0 0;line-height:1.2}.product-caption p{font-size:.875rem;color:var(--muted);margin:0;align-self:center}.maquila{background:var(--green);color:var(--paper)}.maquila-inner{display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center;padding-block:85px}.maquila .eyebrow{color:#ead68f}.maquila h2{font-size:clamp(3rem,4.8vw,4.5rem);margin-bottom:24px}.maquila h2 em{color:#f5ce69}.maquila-copy>p:not(.eyebrow){max-width:380px;color:#d7e1d3;font-size:1.0625rem;line-height:1.8;margin-bottom:29px}.light{background:var(--paper);color:var(--green)}.light:hover{background:#f5ce69}.maquila-photo{position:relative}.maquila-photo img{height:470px;width:100%;object-fit:cover;border-radius:4px}.maquila-caption{border:1px solid #c1d0bf77;position:relative;background:var(--green);padding:17px 22px;margin:-28px -15px 0 35px;font-size:.75rem;letter-spacing:.12em;font-weight:600}.maquila-caption span{display:block;font-family:var(--serif);letter-spacing:0;font-size:1.7rem;color:#f5ce69}.project-details{border-top:1px solid #ffffff29;padding:45px 0 60px;display:grid;grid-template-columns:1fr 1.8fr;gap:70px}.project-heading h3{font-family:var(--serif);font-size:1.7rem;font-weight:500;line-height:1.25;margin:15px 0}.project-heading p{color:#c0d0c0;font-size:.875rem;line-height:1.7;margin:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.steps article>span{display:block;color:#f5ce69;font-family:var(--serif);font-size:1.55rem;margin-bottom:18px}.steps h4{font-size:1rem;font-weight:600;line-height:1.5;margin-bottom:11px}.steps p{font-size:.875rem;color:#c0d0c0;line-height:1.8;margin:0}.story{display:grid;grid-template-columns:1fr 1.65fr;gap:100px;padding-block:100px}.story-date{border-right:1px solid var(--line)}.story-date>span{display:block;font-family:var(--serif);font-size:2.8rem;line-height:1.1}.story-date strong{font-size:clamp(5rem,8vw,8rem);font-weight:500;color:var(--red);letter-spacing:-.06em}.story-date>p:last-child{color:var(--muted);font-size:.875rem;margin-top:28px}.story-copy h2{font-size:clamp(2.3rem,3vw,3rem);margin-bottom:27px}.story-copy>p{color:var(--muted);max-width:580px}.story-signature{display:block;font-family:var(--serif);font-style:italic;font-size:1.5rem;color:var(--red);margin-top:30px}footer{background:#efeede;border-top:1px solid #dedfce}.footer-main{display:grid;grid-template-columns:1.3fr 1fr .8fr;gap:40px;align-items:center;padding-block:45px}.footer-main>p{font-family:var(--serif);font-size:1.6rem;line-height:1.3;margin:0}.footer-main nav{display:grid;gap:8px;font-size:.875rem}.footer-bottom{padding-block:20px;border-top:1px solid #d1d3c2;display:flex;justify-content:space-between;gap:20px;font-size:.75rem;color:#5d6656}
@media(min-width:1600px){.hero{gap:80px}}@media(max-width:1100px){.section{width:calc(100% - 64px)}.header{width:calc(100% - 48px)}.header nav{gap:20px}.hero{gap:30px}.hero-photo{height:510px}.hero-actions{gap:16px}.maquila-inner{gap:45px}.project-details{gap:35px;grid-template-columns:1fr 2fr}.product-image{height:330px}.story{gap:55px}.brand-ribbon{font-size:1.2rem}.brand-ribbon span:last-child{display:none}.brand-ribbon i:last-of-type{display:none}}
@media(max-width:760px){.section{width:calc(100% - 40px)}.topbar{font-size:.75rem;letter-spacing:.06em;padding:9px 12px}.topbar span{padding:0 8px}.header{width:calc(100% - 40px);padding:15px 0;flex-wrap:wrap;gap:15px}.brand img{width:60px;height:60px}.brand strong{font-size:1.45rem}.header nav{width:100%;justify-content:space-between;gap:12px;font-size:.8125rem}.nav-cta{padding:8px 10px}.nav-cta span{display:none}.hero{grid-template-columns:1fr;padding-top:37px;padding-bottom:40px;gap:35px}.eyebrow{font-size:.75rem;margin-bottom:18px}h1{font-size:clamp(3rem,10.8vw,4.5rem);margin-bottom:22px}.intro{font-size:1rem;max-width:100%;margin-bottom:24px}.hero-note{margin-top:24px}.hero-visual{padding-bottom:20px}.hero-photo{height:380px;border-radius:110px 110px 5px 5px}.photo-label{left:12px;bottom:55px;padding:15px 20px}.photo-label strong{font-size:1.3rem}.photo-index{font-size:.75rem}.brand-ribbon{padding:19px 20px;font-size:1.05rem;gap:15px;flex-wrap:wrap}.brand-ribbon span:nth-of-type(3),.brand-ribbon i:nth-of-type(2){display:none}.products{padding-block:55px}.section-heading{grid-template-columns:1fr;gap:22px;margin-bottom:30px}.section-heading>p{max-width:100%}h2{font-size:2.45rem}.product-grid{grid-template-columns:1fr;gap:32px}.product-image{height:320px}.product-caption{gap:20px;padding:20px 0}.product-caption h3{font-size:1.55rem}.product-caption p{font-size:.875rem}.maquila-inner{grid-template-columns:1fr;gap:40px;padding-block:55px}.maquila h2{font-size:3.25rem}.maquila-photo img{height:360px}.maquila-caption{margin-right:0}.project-details{grid-template-columns:1fr;gap:27px;padding:35px 0 45px}.steps{grid-template-columns:1fr;gap:24px}.steps article{display:grid;grid-template-columns:40px 1fr;column-gap:12px}.steps article>span{grid-row:1/3;margin:0}.steps h4{margin:0 0 5px}.steps p{grid-column:2}.story{grid-template-columns:1fr;gap:30px;padding-block:55px}.story-date{border:0;border-bottom:1px solid var(--line);padding-bottom:25px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.story-date>.eyebrow{width:100%;margin-bottom:0}.story-date>span{font-size:1.75rem}.story-date strong{font-size:4.6rem}.story-date>p:last-child{margin:0}.story-copy h2{font-size:2.3rem}.footer-main{grid-template-columns:1fr 1fr;gap:30px;padding-block:35px}.footer-brand{grid-column:1/-1}.footer-main>p{font-size:1.4rem}.footer-bottom{flex-wrap:wrap;font-size:.75rem;gap:10px 25px}.footer-bottom span:first-child{width:100%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}

/* Adaptation of the supplied SuperHonduPan visual direction.
   Reference: slides 7, 11, 17-26. This changes presentation only.
   Original Superman logos, photographs and all page copy stay intact.
   Orange/yellow/white lead; green is a supporting heritage accent.
   A darker orange is used for small text and white-text controls.
   The deck gives visual guidance, not a prescribed web font family;
   the serif headlines follow its web example, with clear sans body text. */
:root {
  --paper: #F8F7F4;
  --ink: #151515;
  --green: #1F6B3A;
  --red: #BD3B1B;
  --orange: #E84923;
  --gold: #FFD60A;
  --line: #E2DED7;
  --muted: #625E59;
}
body { background: #FFFFFF; }
.topbar { background: var(--orange); color: #151515; font-weight: 700; }
.topbar span { color: #151515; }
.header { background: #FFFFFF; padding-block: 25px; border-color: var(--line); }
.brand { gap: 18px; }
.brand img { object-fit: contain; flex-shrink: 0; }
.brand strong { color: #151515; font-weight: 700; }
.nav-cta { background: var(--red); color: #FFFFFF; border-color: var(--red); border-radius: 8px; }
.nav-cta:hover { background: #9B2E13; text-decoration: none; }
.hero { width: 100%; padding-inline: max(56px, calc((100% - 1280px) / 2)); background: var(--paper); gap: 58px; }
.eyebrow { letter-spacing: .12em; }
.hero-copy > .eyebrow { color: var(--green); }
.short-rule { width: 30px; height: 4px; background: var(--orange); }
h1, h2 { font-weight: 700; letter-spacing: -.045em; line-height: 1.12; }
h1 { font-size: clamp(3.2rem, 4.8vw, 4.75rem); }
h1 em, h2 em { font-style: normal; font-weight: 700; color: var(--red); }
.intro { color: var(--muted); }
.button { border-radius: 8px; font-weight: 700; }
.primary { background: var(--red); }
.primary:hover { background: #9B2E13; }
.text-link { color: var(--red); }
.hero-note { border-top: 1px solid var(--line); padding-top: 23px; max-width: 390px; }
.note-number { color: var(--red); font-weight: 700; border-color: var(--line); }
.hero-photo { border-radius: 12px 80px 12px 12px; height: 530px; }
.photo-label { left: -20px; bottom: 63px; transform: none; color: #151515; background: var(--gold); border-radius: 3px 20px 3px 3px; border-bottom: 6px solid var(--orange); box-shadow: none; }
.photo-label strong { font-style: normal; font-weight: 700; }
.photo-index { color: var(--muted); }
.brand-ribbon { background: var(--orange); color: #FFFFFF; border-bottom: 7px solid var(--gold); font-weight: 700; font-size: 1.5rem; }
.brand-ribbon i { color: var(--gold); }
.products .eyebrow { color: var(--red); }
.product-image { border-radius: 10px; }
.image-tag { background: #FFFFFF; border-left: 4px solid var(--orange); color: #151515; border-radius: 3px; }
.product-caption { border-color: var(--line); }
.product-caption h3 { font-weight: 700; }
.product-type { color: var(--green); }
.maquila { background: var(--orange); color: #FFFFFF; }
.maquila-inner { padding-block: 80px; }
.maquila .eyebrow { color: #151515; }
.maquila h2 { font-weight: 700; }
.maquila h2 em { color: #FFFFFF; text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 4px; text-underline-offset: 11px; }
.maquila-copy > p:not(.eyebrow) { color: #151515; font-weight: 500; }
.light { background: #FFFFFF; color: var(--red); }
.light:hover { background: var(--gold); color: #151515; }
.maquila-photo img { border-radius: 10px; }
.maquila-caption { color: #151515; background: #FFFFFF; border: 0; border-bottom: 7px solid var(--gold); border-radius: 4px; }
.maquila-caption span { color: var(--red); font-weight: 700; }
.project-details { background: var(--paper); color: var(--ink); border-top: 0; padding: 40px; border-radius: 10px 10px 0 0; }
.project-details .eyebrow { color: var(--red); }
.project-heading h3 { font-weight: 700; }
.project-heading p, .steps p { color: var(--muted); }
.steps article > span { color: var(--red); font-weight: 700; }
.story { background: #FFFFFF; row-gap: 40px; }
.story-flags { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 20px 36px; list-style: none; margin: 0; padding: 0 0 28px; border-bottom: 1px solid var(--line); }
.story-flags li { display: flex; align-items: center; gap: 12px; font-size: .875rem; font-weight: 600; }
.story-flags img { width: 64px; height: 48px; object-fit: contain; border: 1px solid var(--line); border-radius: 3px; }
@media (max-width: 760px) {
  .story-flags { justify-content: space-between; gap: 12px; }
  .story-flags li { flex-direction: column; gap: 8px; text-align: center; }
  .story-flags img { width: 56px; height: 42px; }
}
.story-date strong { color: var(--red); font-weight: 700; }
.story-date > .eyebrow { color: var(--green); }
.story-signature { color: var(--red); font-style: normal; font-weight: 600; }
footer { background: var(--paper); border-top: 8px solid var(--orange); }
.footer-main > p { font-weight: 600; }
.footer-bottom { color: var(--muted); border-color: var(--line); }
a:focus-visible { outline-color: #151515; }
.header nav { gap: clamp(16px, 2.4vw, 32px); flex-wrap: wrap; }
.social-links { display: flex; flex-wrap: wrap; gap: 12px; }
.social-links a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 10px; color: var(--red); border: 1px solid var(--line); border-radius: 8px; background: #FFFFFF; }
.social-links a:hover { background: #FFFFFF; border-color: var(--red); text-decoration: none; }
.social-links svg { flex-shrink: 0; }
.footer-social { grid-column: 1 / -1; padding-top: 20px; border-top: 1px solid var(--line); }
.contact { padding-block: 70px 85px; }
.contact > .eyebrow { color: var(--green); }
.contact > h1 { margin-bottom: 42px; }
.contact-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 70px; align-items: start; }
.contact h2 { font-size: clamp(1.8rem, 2.5vw, 2.3rem); margin-bottom: 20px; }
.contact-info > p { color: var(--muted); max-width: 390px; }
.contact h3 { font-family: var(--sans); font-size: 1rem; margin-bottom: 10px; }
.contact-location, .contact-networks { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--line); }
.contact-location p { margin-bottom: 0; }
.contact-phones { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--line); }
.contact-phones ul { display: grid; grid-template-columns: 1fr; gap: 10px; margin: 0; padding: 0; list-style: none; }
.contact-phones li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 16px; }
.contact-phones a.whatsapp-link { color: var(--green); border: 1px solid var(--green); border-radius: 8px; width: 44px; height: 44px; padding: 9px; justify-content: center; flex-shrink: 0; }
.whatsapp-link img { display: block; width: 24px; height: 24px; }
.contact-emails { margin-top: 32px; padding-top: 24px; border-top: 1px solid var(--line); min-width: 0; }
.contact-emails ul { margin: 0; padding: 0; list-style: none; }
.contact-emails a { display: inline-block; padding-block: 10px; color: var(--red); font-weight: 600; overflow-wrap: anywhere; }
.contact-phones a { display: inline-flex; align-items: center; min-height: 44px; color: var(--red); font-weight: 600; white-space: nowrap; }
@media (max-width: 1100px) and (min-width: 901px), (max-width: 420px) {
  .contact-phones ul { grid-template-columns: 1fr; }
}
.contact-form-panel { background: var(--paper); border-top: 6px solid var(--orange); border-radius: 10px; padding: 32px; min-width: 0; }
.form-notice { font-size: .9375rem; color: var(--muted); }
.contact fieldset { margin: 0; padding: 0; border: 0; min-width: 0; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.form-field { min-width: 0; margin-bottom: 18px; }
.form-field label { display: block; font-size: .875rem; font-weight: 600; margin-bottom: 7px; }
.form-field input, .form-field textarea, .form-field select { display: block; width: 100%; min-width: 0; padding: 12px; font: inherit; border: 1px solid #CBC7C0; border-radius: 6px; background: #FFFFFF; color: var(--ink); }
.form-field :is(input, textarea, select):focus-visible, .contact button:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
.contact button:not(:disabled) { cursor: pointer; }
.form-field textarea { resize: vertical; }
.contact button { font-family: var(--sans); border: 0; }
.contact button:disabled { background: #D8D3CB; color: #514C45; cursor: not-allowed; transform: none; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (max-width: 900px) {
  .contact-grid { grid-template-columns: 1fr; gap: 35px; }
  .contact-info > p { max-width: 100%; }
}
@media (max-width: 760px) {
  .contact { padding-block: 40px 55px; }
  .contact > h1 { margin-bottom: 30px; }
  .contact-form-panel { padding: 24px 20px; }
  .form-row { grid-template-columns: 1fr; gap: 0; }
  .header nav .nav-cta { grid-column: 1 / -1; text-align: center; }
}
/* Independent product and maquila pages retain the original section styling. */
.header nav a[aria-current="page"] { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 7px; }
.products h1 { font-size: clamp(2.5rem, 3.5vw, 3.5rem); margin-bottom: 0; }
.maquila h1 { font-size: clamp(3rem, 4.8vw, 4.5rem); margin-bottom: 24px; }
.maquila h1 em { color: #FFFFFF; text-decoration: underline; text-decoration-color: var(--gold); text-decoration-thickness: 4px; text-underline-offset: 11px; }
@media (max-width: 1100px) {
  .header { flex-wrap: wrap; }
  .header nav { flex-wrap: wrap; }
  .hero { gap: 30px; padding-inline: 32px; }
  .hero-photo { height: 500px; }
  .project-details { padding: 35px 25px; gap: 30px; }
  .brand-ribbon { font-size: 1.25rem; }
}
@media (max-width: 760px) {
  .header nav { display: grid; grid-template-columns: auto auto; justify-content: space-between; gap: 12px 16px; }
  .products h1 { font-size: clamp(2rem, 7.6vw, 2.45rem); }
  .maquila h1 { font-size: clamp(2.6rem, 9.5vw, 3.25rem); }
  .header { padding-block: 16px; }
  .hero { gap: 32px; padding-inline: 20px; }
  h1 { font-size: clamp(2.8rem, 10vw, 4.4rem); }
  h2 { font-size: clamp(2rem, 7.6vw, 2.45rem); }
  .hero-photo { height: 370px; border-radius: 10px 60px 10px 10px; }
  .photo-label { left: 10px; right: 10px; width: fit-content; max-width: calc(100% - 20px); bottom: 54px; padding: 14px 18px; }
  .photo-label strong { font-size: 1.25rem; }
  .brand-ribbon { font-size: 1.1875rem; }
  .maquila-inner { padding-block: 50px; }
  .maquila h2 { font-size: clamp(2.6rem, 9.5vw, 3.25rem); }
  .project-details { padding: 30px 22px; }
  .story-copy h2 { font-size: clamp(2rem, 7.6vw, 2.3rem); }
}