/* NoeApps: product-led editorial presentation. */
:root { --surface:#f3f6fa; --accent:#007d72; --deep:#081c32; --line:#dde5ed; }
.site-header { min-height:96px; }
.site-header nav { gap:1.6rem; font-size:.9375rem; }
.site-header .nav-portfolio { color:var(--accent); }
.button { border-radius:7px; min-height:48px; font-weight:600; }
.button-dark { background:var(--navy); }
.button:hover { text-decoration:none; filter:brightness(1.08); }
.eyebrow { font-size:.875rem; letter-spacing:.11em; }
.visual-hero { display:grid; grid-template-columns:1fr 1.08fr; align-items:center; gap:54px; padding:66px 0 54px; }
.visual-hero .eyebrow { color:var(--accent); margin:0 0 25px; }
.visual-hero h1 { font-size:clamp(2.9rem,5.15vw,4.4rem); line-height:1.08; letter-spacing:-.052em; max-width:580px; }
.visual-hero h1 em { color:var(--accent); font-style:normal; }
.visual-hero .hub-lead { max-width:480px; margin:25px 0; font-size:1.125rem; line-height:1.75; }
.hero-actions { gap:22px; margin-top:30px; }
.hero-mosaic { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:18px; background:var(--deep); border-radius:18px; box-shadow:0 18px 50px #102b4914; }
.mosaic-main { grid-column:1/-1; min-width:0; background:#fff; border-radius:10px; padding:13px 14px 0; overflow:hidden; }
.mosaic-main>span { display:flex; justify-content:space-between; gap:15px; color:#183047; font-size:.875rem; margin-bottom:13px; }
.mosaic-main>span b { font-weight:600; }
.mosaic-main>span small { font-size:.8125rem; color:var(--muted); }
.mosaic-main img { width:100%; height:225px; object-fit:contain; object-position:top center; }
.mosaic-main:hover { text-decoration:none; }
.mosaic-product { min-width:0; background:#15314a; color:#fff; border:1px solid #ffffff12; border-radius:9px; padding:16px 10px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; text-align:center; }
.mosaic-product img { width:61px; height:61px; object-fit:contain; border-radius:10px; }
.mosaic-product>span { font-size:.875rem; font-weight:500; line-height:1.3; }
.mosaic-fivaki { background:#030d19; }
.mosaic-comercio img { width:90px; height:61px; border-radius:4px; background:white; }
.catalog-jump { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; padding:23px 0; margin-bottom:45px; border-block:1px solid var(--line); }
.catalog-jump a { display:flex; align-items:center; gap:16px; font-size:.9375rem; }
.catalog-jump strong { font:600 1.5rem var(--heading); color:var(--accent); }
.catalog-jump span { flex:1; }
.catalog-jump .jump-arrow { flex:0; font-size:1.25rem; color:var(--accent); }
.catalog-section { border-top:0; padding:20px 0 64px; scroll-margin-top:28px; }
.section-heading { align-items:end; gap:45px; margin-bottom:30px; }
.section-heading .eyebrow { color:var(--accent); font-size:.875rem; margin-bottom:12px; }
.section-heading h2 { max-width:560px; font-size:clamp(1.9rem,3.2vw,2.55rem); line-height:1.2; letter-spacing:-.035em; }
.section-heading>p { max-width:390px; font-size:1rem; line-height:1.7; }
.catalog-grid { gap:25px; }
.grid-apps { grid-template-columns:repeat(2,minmax(0,1fr)); }
.product-visual-card { display:flex; flex-direction:column; min-width:0; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; transition:box-shadow .2s,border-color .2s; }
.product-visual-card:hover { border-color:#aec3d3; box-shadow:0 10px 30px #102b490a; }
.product-preview { display:flex; align-items:center; justify-content:center; height:305px; padding:24px; background:#e9f1f8; border-bottom:1px solid var(--line); }
.product-preview img { display:block; width:100%; height:100%; object-fit:contain; filter:drop-shadow(0 7px 12px #102b4914); }
.preview-forgeops { background:#0d2238; }
.preview-deleteguard { background:#edf4fb; }
.preview-fivaki { background:#020a15; padding:17px; gap:18px; }
.preview-fivaki img { width:calc(50% - 9px); max-width:100%; height:100%; object-fit:contain; filter:none; }
.preview-pequeno-comercio { background:#edf1ff; }
.product-card-body { padding:27px 29px; display:flex; flex-direction:column; flex:1; }
.product-card-body .card-top { gap:14px; margin-bottom:16px; align-items:center; flex-wrap:wrap; }
.card-label { color:#527084; font-size:.875rem; margin:0; }
.status,.catalog-card .status,.grid-proyectos .status { font-size:.875rem; font-weight:500; border-radius:5px; padding:5px 9px; line-height:1.35; background:#f1f6f8; color:#335967; border-color:#dae6eb; }
.product-card-body h3 { font-size:2rem; letter-spacing:-.045em; font-weight:650; }
.product-card-body .card-description { font-size:1rem; line-height:1.7; margin:15px 0 18px; }
.card-benefits { padding:0; margin:0 0 24px; list-style:none; display:flex; flex-wrap:wrap; gap:8px; }
.card-benefits li { padding:5px 9px; background:#f3f6f9; border-radius:4px; color:#435c71; font-size:.875rem; }
.card-actions { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:15px; margin-top:auto; padding-top:21px; border-top:1px solid var(--line); }
.card-actions .button { padding:11px 16px; gap:24px; font-size:.9375rem; }
.card-actions .text-link { font-size:.9375rem; }
.grid-herramientas,.grid-proyectos { grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.grid-herramientas .catalog-card,.grid-proyectos .catalog-card { padding:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; }
.mini-image { display:block; aspect-ratio:3/2; background:var(--deep); overflow:hidden; border-bottom:1px solid var(--line); }
.mini-image img { width:100%; height:100%; object-fit:contain; }
.mini-card-body { padding:24px; display:flex; flex-direction:column; flex:1; }
.mini-card-body .card-top { margin-bottom:17px; flex-wrap:wrap; align-items:center; gap:12px; }
.grid-herramientas h3,.grid-proyectos h3 { font-size:1.5rem; line-height:1.25; letter-spacing:-.035em; }
.mini-card-body .card-description { margin:14px 0 23px; font-size:1rem; line-height:1.65; }
.grid-herramientas .card-link,.grid-proyectos .card-link { padding-top:16px; border-top:1px solid var(--line); font-size:.9375rem; margin-top:auto; }
.image-kind { display:none; }
.collection-intro { border-left:3px solid var(--accent); padding:19px 23px; background:#f0f6f8; display:flex; justify-content:space-between; align-items:center; gap:30px; margin:0 0 27px; }
.collection-intro p { margin:0; max-width:760px; color:#405a6c; }
.collection-intro .text-link { flex-shrink:0; font-size:.9375rem; }
.contact-band { border-radius:14px; padding:40px; background:var(--deep); gap:35px; margin:0 0 15px; }
.contact-band .eyebrow { color:#8ae0d3; }
.contact-band h2 { font-size:2.2rem; line-height:1.2; }
.contact-band p { max-width:640px; }
.about { padding:58px 0; gap:45px; }
.about h2 { font-size:2.1rem; }
.about p { max-width:770px; }
.breadcrumb { font-size:.875rem; padding:29px 0; }
.product-story-hero { display:grid; grid-template-columns:1fr 1.06fr; align-items:center; gap:54px; padding:25px 0 57px; }
.product-story-hero .eyebrow { color:var(--accent); margin:0 0 14px; }
.product-story-hero h1 { font-size:clamp(2.55rem,4.5vw,4rem); line-height:1.1; margin:23px 0 19px; letter-spacing:-.045em; overflow-wrap:anywhere; }
.product-story-hero .detail-lead { font-size:1.4rem; line-height:1.45; margin:0 0 17px; letter-spacing:-.015em; }
.product-story-hero .detail-description { font-size:1.0625rem; line-height:1.75; margin:0; }
.product-story-hero figure { margin:0; min-width:0; }
.product-story-image { display:flex; align-items:center; justify-content:center; min-height:330px; padding:18px; background:#edf3f9; border:1px solid var(--line); border-radius:14px; overflow:hidden; }
.product-story-image img { width:100%; max-height:430px; object-fit:contain; }
.product-story-image.image-forgeops { background:#0d2238; }
.product-story-image.image-fivaki { background:#020a15; padding:20px; gap:18px; }
.product-story-image.image-fivaki img { width:calc(50% - 9px); height:430px; max-width:100%; max-height:460px; object-fit:contain; }
.product-story-image.concept-image { min-height:0; padding:0; aspect-ratio:3/2; background:var(--deep); }
.product-story-image.concept-image img { width:100%; height:100%; max-height:none; object-fit:contain; }
.product-story-hero figcaption,.gallery-item figcaption { color:#5b6e80; font-size:.875rem; line-height:1.5; margin:12px 0 0; }
.story-section { padding:42px 0; border-top:1px solid var(--line); }
.story-heading { max-width:790px; margin-bottom:29px; }
.story-heading .eyebrow { color:var(--accent); margin:0 0 12px; }
.story-heading h2 { font-size:clamp(1.8rem,3vw,2.3rem); line-height:1.25; letter-spacing:-.035em; }
.story-heading>p { font-size:1rem; line-height:1.7; color:var(--muted); margin:16px 0 0; }
.benefit-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.benefit-item { padding:24px; background:var(--surface); border-radius:10px; }
.benefit-item>span { font:600 .875rem var(--heading); color:var(--accent); }
.benefit-item h3 { font-size:1.2rem; line-height:1.35; letter-spacing:-.025em; margin:16px 0 13px; }
.benefit-item p { font-size:1rem; color:#40576c; margin:0; line-height:1.7; }
.use-grid { display:grid; grid-template-columns:1fr 1fr; gap:55px; }
.audience-box { padding:25px; background:#edf5f7; border-left:3px solid var(--accent); }
.audience-box h3 { font-size:1.2rem; margin:0 0 14px; }
.audience-box p { color:#40576c; margin:0; }
.use-example { margin:25px 0 0; }
.use-example h3 { font-size:1.125rem; letter-spacing:-.02em; }
.use-grid h2 { font-size:1.9rem; margin:0 0 24px; }
.use-grid ol { list-style:none; padding:0; margin:0; display:grid; gap:22px; }
.use-grid li { display:flex; gap:18px; }
.use-grid li>span { font-size:.875rem; font-weight:600; color:var(--accent); padding-top:3px; }
.use-grid li p { margin:0; color:#40576c; }
.process-flow { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:28px; }
.process-flow span { border:1px solid #cbdde6; border-radius:6px; padding:8px 12px; background:#f3f7fa; font-size:.9375rem; color:#36546b; }
.process-flow b { color:var(--accent); }
.gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
.gallery-item { margin:0; min-width:0; }
.gallery-item a { display:flex; align-items:center; justify-content:center; background:#edf3f9; border:1px solid var(--line); border-radius:12px; padding:16px; }
.gallery-item img { width:100%; height:290px; object-fit:contain; }
.gallery-grid.phone-gallery { grid-template-columns:repeat(2,minmax(0,1fr)); max-width:800px; }
.phone-gallery .gallery-item img { height:680px; }
.faq-layout { display:grid; grid-template-columns:1.25fr .75fr; gap:55px; align-items:start; }
.faq-list h2 { font-size:1.9rem; line-height:1.2; margin:0 0 25px; }
.faq-list details { padding:20px 0; border-top:1px solid var(--line); }
.faq-list details:last-child { border-bottom:1px solid var(--line); }
.faq-list summary { font-weight:600; cursor:pointer; line-height:1.55; padding-right:14px; }
.faq-list summary:focus-visible { outline:3px solid var(--accent); outline-offset:6px; }
.faq-list details p { font-size:1rem; line-height:1.7; color:#40576c; margin:14px 0 0; }
.story-access { padding:30px; background:var(--deep); color:#fff; border-radius:12px; }
.story-access .eyebrow { color:#8de2d4; font-size:.875rem; margin:0 0 16px; }
.story-access h2 { font-size:1.6rem; line-height:1.3; margin:0 0 19px; }
.story-access p { color:#ccdae7; font-size:1rem; line-height:1.7; margin:0 0 23px; }
.story-access .button { width:100%; justify-content:space-between; gap:16px; }
.story-access .small-copy { font-size:.875rem; margin:20px 0 0; }
.story-access a:not(.button) { color:#fff; text-decoration:underline; text-underline-offset:3px; }
.docs-links { display:flex; flex-wrap:wrap; gap:14px 24px; }
.docs-links a { text-decoration:underline; text-underline-offset:4px; }
.more-catalog { padding-top:35px; }
.more-catalog h2 { font-size:1.65rem; }
.site-footer { font-size:.875rem; padding-block:30px; }
@media(max-width:1050px) {
  .visual-hero,.product-story-hero { gap:30px; }
  .visual-hero h1 { font-size:3.25rem; }
  .mosaic-main img { height:175px; }
  .mosaic-product { padding:13px 8px; }
  .mosaic-product img { width:48px; height:48px; }
  .mosaic-comercio img { width:75px; }
  .grid-herramientas,.grid-proyectos { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .product-preview { height:265px; padding:18px; }
  .preview-fivaki { padding:17px; }
  .product-card-body { padding:24px; }
  .benefit-grid { gap:18px; }
  .benefit-item { padding:22px; }
  .faq-layout,.use-grid { gap:32px; }
}
@media(max-width:740px) {
  .wrap { width:calc(100% - 36px); }
  .site-header { min-height:0; padding-block:25px; gap:23px; align-items:flex-start; flex-direction:column; }
  .site-header nav { gap:13px 23px; font-size:.9375rem; }
  .visual-hero,.product-story-hero { grid-template-columns:1fr; gap:33px; padding:38px 0; }
  .visual-hero h1 { font-size:clamp(2.7rem,9vw,3.8rem); max-width:550px; }
  .visual-hero .hub-lead { font-size:1.0625rem; max-width:520px; }
  .hero-actions { gap:20px; }
  .hero-mosaic { padding:14px; gap:10px; }
  .mosaic-main { padding:12px 10px 0; }
  .mosaic-main img { height:auto; max-height:230px; }
  .mosaic-main>span { font-size:.875rem; }
  .mosaic-product>span { font-size:.8125rem; }
  .catalog-jump { gap:15px; padding:18px 0; margin-bottom:32px; }
  .catalog-jump a { flex-wrap:wrap; gap:8px; font-size:.875rem; }
  .catalog-jump strong { font-size:1.2rem; }
  .catalog-jump .jump-arrow { display:none; }
  .catalog-jump span { flex-basis:100%; }
  .catalog-section { padding:15px 0 44px; }
  .section-heading { display:block; margin-bottom:24px; }
  .section-heading>p { max-width:100%; margin:18px 0 0; }
  .grid-apps,.grid-herramientas,.grid-proyectos { grid-template-columns:1fr; gap:24px; }
  .product-preview { height:270px; }
  .product-card-body h3 { font-size:1.85rem; }
  .collection-intro { display:block; padding:21px; }
  .collection-intro .text-link { display:inline-block; margin-top:16px; }
  .contact-band { padding:28px; display:block; }
  .contact-band h2 { font-size:1.85rem; }
  .contact-band .button { margin-top:21px; }
  .about { grid-template-columns:1fr; gap:18px; padding:40px 0; }
  .product-story-hero { padding:15px 0 38px; }
  .product-story-hero h1 { font-size:clamp(2.4rem,8.5vw,3.4rem); }
  .product-story-image { min-height:0; padding:14px; }
  .product-story-image.image-fivaki { padding:12px; gap:12px; }
  .product-story-image.image-fivaki img { width:calc(50% - 6px); height:320px; max-height:390px; }
  .story-section { padding:33px 0; }
  .benefit-grid,.use-grid,.faq-layout,.gallery-grid { grid-template-columns:1fr; gap:25px; }
  .gallery-grid.phone-gallery { grid-template-columns:1fr; gap:25px; }
  .phone-gallery .gallery-item a { padding:8px; }
  .phone-gallery .gallery-item img { height:auto; max-height:720px; }
  .gallery-item img { height:auto; max-height:360px; }
  .story-access { padding:27px; }
}
@media(prefers-reduced-motion:reduce) { .product-visual-card { transition:none; } }

/* NoeApps Guard identities: preserve full artwork at all widths. */
.preview-broken-link-guard,.preview-leaver-guard,.image-broken-link-guard,.image-leaver-guard{background:#f5f8f9!important;display:flex;align-items:center;justify-content:center}
.preview-broken-link-guard img,.preview-leaver-guard img,.image-broken-link-guard img,.image-leaver-guard img{object-fit:contain!important;width:70%!important;height:100%!important;max-height:390px;padding:24px;box-sizing:border-box}
.document table{width:100%;border-collapse:collapse}.document th,.document td{padding:12px;text-align:left;vertical-align:top;border-bottom:1px solid #d5dce4;overflow-wrap:anywhere}@media(max-width:600px){.document table,.document thead,.document tbody,.document tr,.document th,.document td{display:block}.document th,.document td{padding:8px}}
@media(max-width:850px){.guard-doc .product-layout{grid-template-columns:1fr;gap:0}.guard-doc .product-aside{margin-bottom:40px}.guard-doc .document table,.guard-doc .document thead,.guard-doc .document tbody,.guard-doc .document tr,.guard-doc .document th,.guard-doc .document td{display:block}.guard-doc .document th,.guard-doc .document td{padding:8px}.guard-doc .document thead{display:none}.guard-doc .document td:first-child{font-weight:700;background:#edf5f7}.guard-doc .document td:nth-child(2)::before{content:"Datos: ";font-weight:700}.guard-doc .document td:nth-child(3)::before{content:"Finalidad: ";font-weight:700}}