/* Integrado desde la maqueta aprobada de control-aranas. Selectores aislados para no alterar header/footer global. */
.page-control-aranas{
  --ink:#0b2035;
  --teal:#00aaa3;
  --teal-dark:#008e89;
  --teal-soft:#eaf8f7;
  --line:#dce7e9;
  --muted:#435466;
  --yellow:#f4c43f;
  --shadow:0 10px 28px rgba(11,32,53,.08);
}

.page-control-aranas *{box-sizing:border-box}
.page-control-aranas{scroll-behavior:smooth}
.page-control-aranas{
  margin:0;
  color:var(--ink);
  background:#fff;
  font-family:Arial,Helvetica,sans-serif;
  line-height:1.4;
}
.page-control-aranas img{display:block;max-width:100%}
.page-control-aranas a{color:inherit}

/* HEADER */
.page-control-aranas .site-header{background:#fff;position:relative;z-index:20}
.page-control-aranas .header-inner{
  width:min(1440px,calc(100% - 48px));
  min-height:86px;
  margin:auto;
  display:grid;
  grid-template-columns:250px 1fr auto;
  gap:24px;
  align-items:center;
}
.page-control-aranas .brand img{width:240px;height:72px;object-fit:contain;object-position:left center}
.page-control-aranas .main-nav{display:flex;justify-content:center;align-items:center;gap:36px;font-size:14px}
.page-control-aranas .main-nav>a, .page-control-aranas .nav-dropdown summary{text-decoration:none;white-space:nowrap;cursor:pointer}
.page-control-aranas .nav-dropdown{position:relative}
.page-control-aranas .nav-dropdown summary{list-style:none}
.page-control-aranas .nav-dropdown summary::-webkit-details-marker{display:none}
.page-control-aranas .nav-dropdown summary span{margin-left:5px}
.page-control-aranas .dropdown-menu{
  position:absolute;top:calc(100% + 16px);left:50%;transform:translateX(-50%);
  width:240px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:14px;
  box-shadow:0 18px 44px rgba(9,35,54,.13)
}
.page-control-aranas .dropdown-menu-small{width:180px}
.page-control-aranas .dropdown-menu a{display:block;text-decoration:none;padding:9px 10px;border-radius:8px;font-size:13px}
.page-control-aranas .dropdown-menu a:hover, .page-control-aranas .dropdown-menu a.active{background:var(--teal-soft);color:var(--teal-dark)}
.page-control-aranas .header-actions{display:flex;align-items:center;gap:18px}
.page-control-aranas .phone-box{display:flex;align-items:center;gap:10px;text-decoration:none;white-space:nowrap}
.page-control-aranas .phone-icon{display:grid;place-items:center;width:36px;height:36px;border:1.5px solid #96d9d5;border-radius:50%}
.page-control-aranas .phone-icon img{width:21px;height:21px}
.page-control-aranas .phone-box strong{display:block;font-size:15px;line-height:1.1}
.page-control-aranas .phone-box small{display:block;margin-top:3px;color:var(--teal);font-size:12px}
.page-control-aranas .button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:46px;padding:0 25px;border-radius:13px;text-decoration:none;font-weight:700}
.page-control-aranas .button-primary{color:#fff;background:linear-gradient(135deg,#009d98,#00aaa3);box-shadow:0 8px 20px rgba(0,157,152,.15)}
.page-control-aranas .header-cta{min-width:190px}

/* GENERAL */
.page-control-aranas .page-shell{width:min(1500px,calc(100% - 36px));margin:0 auto 20px}
.page-control-aranas .top-layout{display:grid;grid-template-columns:37.5% 27% 1fr;gap:18px;align-items:stretch}

/* HERO */
.page-control-aranas .hero-photo{margin:0;overflow:hidden;border-radius:22px;min-height:378px}
.page-control-aranas .hero-photo img{width:100%;height:100%;object-fit:cover;object-position:center}
.page-control-aranas .hero-copy{display:flex;flex-direction:column;justify-content:space-between;padding:23px 0 34px 18px;min-width:0}
.page-control-aranas .hero-copy h1{margin:0;font-size:clamp(44px,3.2vw,58px);line-height:.98;letter-spacing:-2.3px}
.page-control-aranas .lead{margin:14px 0 0;color:var(--teal-dark);font-size:clamp(18px,1.45vw,22px);line-height:1.28;font-weight:500}
.page-control-aranas .benefit-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:28px}
.page-control-aranas .benefit-grid article{text-align:center;padding:0 10px}
.page-control-aranas .benefit-grid article+article{border-left:1px solid #d8e2e5}
.page-control-aranas .benefit-grid img{width:48px;height:48px;margin:0 auto 10px}
.page-control-aranas .benefit-grid h2{margin:0 0 5px;font-size:13px;line-height:1.25}
.page-control-aranas .benefit-grid p{margin:0;color:#263a4c;font-size:12.5px;line-height:1.42}

/* PLAN LATERAL */
.page-control-aranas .plan-card{padding:24px 50px 16px;background:linear-gradient(135deg,#eef9f8 0%,#f9fdfd 100%);border:1px solid #d6eeee;border-radius:20px}
.page-control-aranas .plan-card>h2{margin:0 0 14px;font-size:21px}
.page-control-aranas .plan-point{display:grid;grid-template-columns:66px 1fr;align-items:center;gap:14px;margin:10px 0}
.page-control-aranas .icon-bubble{display:grid;place-items:center;width:64px;height:64px;background:#e1f4f2;border-radius:50%}
.page-control-aranas .icon-bubble img{width:40px;height:40px}
.page-control-aranas .plan-point h3{margin:0 0 3px;font-size:14px}
.page-control-aranas .plan-point p{margin:0;color:#2c3c4c;font-size:12.5px;line-height:1.43}
.page-control-aranas .proposal-button{width:100%;margin-top:9px;font-size:15px}
.page-control-aranas .proposal-button img{width:20px;height:20px;filter:brightness(0) invert(1)}
.page-control-aranas .response-note{display:flex;align-items:center;justify-content:center;gap:6px;margin:6px 0 0;color:#66727f;font-size:11px}
.page-control-aranas .response-note img{width:15px;height:15px}

/* CENTRO */
.page-control-aranas .middle-layout{display:grid;grid-template-columns:1fr;gap:18px;margin-top:18px}
.page-control-aranas .hideouts-card, .page-control-aranas .control-plan-card{min-height:292px;padding:12px 30px 16px;border:1px solid var(--line);border-radius:14px;box-shadow:0 2px 8px rgba(10,40,50,.02)}
.page-control-aranas .hideouts-card>h2, .page-control-aranas .control-plan-card>h2{margin:0 0 8px;font-size:18px}
.page-control-aranas .hideouts-content{display:grid;grid-template-columns:145px 1fr 145px;align-items:center;min-height:235px}
.page-control-aranas .hideout-list{display:grid;align-content:space-around;gap:19px}
.page-control-aranas .hideout-item{display:grid;grid-template-columns:36px 1fr;align-items:center;gap:9px;color:#24384a;font-size:12px;line-height:1.35}
.page-control-aranas .hideout-item img{width:31px;height:31px}

/* Esquema de casa hecho en CSS para no usar una imagen inexistente */
.page-control-aranas .room-map{
  position:relative;
  align-self:end;
  height:235px;
  display:grid;
  grid-template-columns:1.05fr 1fr;
  grid-template-rows:1fr .85fr;
  border:10px solid #e6e0d9;
  border-bottom-width:14px;
  background:#f7f4f0;
  box-shadow:inset 0 0 0 1px #d4ccc3;
}
.page-control-aranas .room{position:relative;border:4px solid #e6e0d9;background:linear-gradient(160deg,#f1eee9,#dbd5ce)}
.page-control-aranas .room:before{content:"";position:absolute;left:14%;right:14%;bottom:12%;height:26%;border-radius:4px;background:#b7aea5;box-shadow:0 -13px 0 -6px #c9c2ba}
.page-control-aranas .bedroom:before{left:18%;right:18%;height:22%;background:#c7bbb0}
.page-control-aranas .kitchen:before{left:8%;right:8%;height:30%;background:linear-gradient(#d6d0c9 0 45%,#a69b90 45% 100%)}
.page-control-aranas .garage:before{left:12%;right:12%;height:55%;background:repeating-linear-gradient(0deg,#a9a096 0 5px,#c4bbb2 5px 10px)}
.page-control-aranas .dot{position:absolute;width:13px;height:13px;border-radius:50%;background:var(--teal-dark);border:2px solid #fff;box-shadow:0 0 0 1px rgba(0,155,150,.55)}
.page-control-aranas .d1{left:4%;top:15%}.page-control-aranas .d2{left:4%;top:50%}.page-control-aranas .d3{left:5%;bottom:9%}.page-control-aranas .d4{right:4%;top:16%}.page-control-aranas .d5{right:4%;top:53%}.page-control-aranas .d6{right:4%;bottom:8%}

/* PLAN DE CONTROL */
.page-control-aranas .control-plan-card{padding-left:34px;padding-right:34px}
.page-control-aranas .steps-list{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr) 28px minmax(0,1fr);align-items:center;gap:8px}
.page-control-aranas .step-card{display:grid;grid-template-columns:36px 54px minmax(0,1fr);align-items:center;gap:12px;min-height:104px;padding:12px 16px;background:#fff;border:1px solid #e4eaed;border-radius:16px;box-shadow:var(--shadow)}
.page-control-aranas .step-number{position:static;inset:auto;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:#fff;font-weight:800;background:linear-gradient(#00aaa3,#008f8a)}
.page-control-aranas .step-card>img{width:46px;height:46px}
.page-control-aranas .step-card h3{margin:0 0 2px;font-size:14px}
.page-control-aranas .step-card p{margin:0;color:#334656;font-size:11.5px;line-height:1.35}
.page-control-aranas .step-arrow{text-align:center;color:var(--teal-dark);font-size:25px;line-height:1;transform:rotate(-90deg)}

/* ALERTA */
.page-control-aranas .warning-bar{display:grid;grid-template-columns:1.55fr .75fr .9fr .85fr;align-items:center;gap:18px;min-height:62px;margin:14px 58px;padding:0 32px;background:linear-gradient(90deg,#fff8e7,#fffaf0);border:1px solid #f2cf70;border-radius:12px}
.page-control-aranas .warning-main{display:flex;align-items:center;gap:20px}
.page-control-aranas .warning-symbol{position:relative;display:grid;place-items:center;width:58px;height:58px;flex:0 0 auto;background:#ffce1e;border-radius:7px;overflow:hidden}
.page-control-aranas .warning-triangle{width:52px;height:52px;filter:brightness(.15)}
.page-control-aranas .warning-bug{position:absolute;width:23px;height:23px;filter:brightness(.1)}
.page-control-aranas .warning-main p{margin:0;font-size:15px;line-height:1.2}.page-control-aranas .warning-main strong{font-size:18px}
.page-control-aranas .warning-tip{display:flex;align-items:center;gap:12px;white-space:nowrap}
.page-control-aranas .tip-icon{display:grid;place-items:center;width:34px;height:34px;background:#fff;border-radius:50%}
.page-control-aranas .tip-icon img{width:24px;height:24px}

/* TARJETAS INFERIORES */
.page-control-aranas .sector-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:0 12px}
.page-control-aranas .sector-card{position:relative;isolation:isolate;display:grid;grid-template-columns:70px 1fr;align-items:center;gap:16px;min-height:145px;overflow:hidden;padding:22px 24px;border-radius:16px;color:#fff;background-position:center;background-size:cover}
.page-control-aranas .residential{background-image:url("../../page-kits/control-aranas/images/sector-residencial.webp")}
.page-control-aranas .commercial{background-image:url("../../page-kits/control-aranas/images/sector-comercial.webp")}
.page-control-aranas .industrial{background-image:url("../../page-kits/control-aranas/images/sector-industrial.webp")}
.page-control-aranas .sector-overlay{position:absolute;z-index:-1;inset:0;background:linear-gradient(90deg,rgba(0,151,147,.98),rgba(0,151,147,.84) 46%,rgba(0,90,89,.18))}
.page-control-aranas .commercial .sector-overlay{background:linear-gradient(90deg,rgba(6,36,59,.98),rgba(6,36,59,.88) 49%,rgba(6,36,59,.22))}
.page-control-aranas .industrial .sector-overlay{background:linear-gradient(90deg,rgba(0,121,126,.98),rgba(0,121,126,.86) 48%,rgba(0,86,91,.15))}
.page-control-aranas .sector-icon{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;background:rgba(255,255,255,.96)}
.page-control-aranas .commercial .sector-icon{background:rgba(8,36,60,.75);border:2px solid #fff}
.page-control-aranas .sector-icon img{width:40px;height:40px}.page-control-aranas .commercial .sector-icon img{filter:brightness(0) invert(1)}
.page-control-aranas .sector-copy h2{margin:0 0 7px;font-size:20px}.page-control-aranas .sector-copy p{max-width:285px;margin:0;font-size:12.5px;line-height:1.4}

@media(max-width:1280px){
  .page-control-aranas .header-inner{grid-template-columns:210px 1fr auto;gap:16px}.page-control-aranas .brand img{width:200px}.page-control-aranas .main-nav{gap:18px;font-size:13px}.page-control-aranas .header-cta{min-width:160px;padding-inline:16px}.page-control-aranas .phone-box small{display:none}.page-control-aranas .plan-card{padding-inline:28px}.page-control-aranas .warning-bar{margin-inline:25px;padding-inline:20px}
}
@media(max-width:1080px){
  .page-control-aranas .header-inner{grid-template-columns:205px 1fr}.page-control-aranas .main-nav{justify-content:flex-end}.page-control-aranas .header-actions{grid-column:1/-1;justify-content:flex-end;padding-bottom:12px}
  .page-control-aranas .top-layout{grid-template-columns:1.1fr .9fr}.page-control-aranas .hero-photo{min-height:420px}.page-control-aranas .plan-card{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.page-control-aranas .plan-card>h2, .page-control-aranas .proposal-button, .page-control-aranas .response-note{grid-column:1/-1}.page-control-aranas .plan-point{grid-template-columns:52px 1fr}.page-control-aranas .icon-bubble{width:50px;height:50px}.page-control-aranas .icon-bubble img{width:32px;height:32px}.page-control-aranas .middle-layout{grid-template-columns:1fr}.page-control-aranas .warning-bar{grid-template-columns:1fr 1fr;padding-block:10px}.page-control-aranas .warning-main{grid-column:1/-1}
}
@media(max-width:820px){
  .page-control-aranas .header-inner{width:min(100% - 24px,760px);grid-template-columns:1fr;padding:10px 0}.page-control-aranas .brand{justify-self:center}.page-control-aranas .main-nav{flex-wrap:wrap;gap:12px 20px}.page-control-aranas .header-actions{justify-content:center;padding-bottom:0}.page-control-aranas .page-shell{width:min(100% - 22px,760px)}.page-control-aranas .top-layout{grid-template-columns:1fr}.page-control-aranas .hero-photo{min-height:0;aspect-ratio:16/11}.page-control-aranas .hero-copy{padding:8px 5px 5px}.page-control-aranas .hero-copy h1{font-size:46px}.page-control-aranas .benefit-grid{margin-top:28px}.page-control-aranas .plan-card{grid-template-columns:1fr}.page-control-aranas .plan-card>h2, .page-control-aranas .proposal-button, .page-control-aranas .response-note{grid-column:auto}.page-control-aranas .hideouts-content{grid-template-columns:1fr}.page-control-aranas .hideout-list{grid-template-columns:repeat(3,1fr);gap:8px;order:2;margin-top:10px}.page-control-aranas .hideout-right{order:3}.page-control-aranas .room-map{order:1}.page-control-aranas .hideout-item{grid-template-columns:28px 1fr;font-size:11px}.page-control-aranas .hideout-item img{width:25px;height:25px}.page-control-aranas .warning-bar{margin-inline:0}.page-control-aranas .sector-grid{grid-template-columns:1fr;margin-inline:0}
}

@media(max-width:820px){
  .page-control-aranas .steps-list{grid-template-columns:1fr}
  .page-control-aranas .step-arrow{transform:none}
}
@media(max-width:560px){
  .page-control-aranas .header-actions{flex-direction:column}.page-control-aranas .main-nav{font-size:12px}.page-control-aranas .dropdown-menu{position:fixed;top:auto;left:12px;right:12px;width:auto;transform:none}.page-control-aranas .hero-copy h1{font-size:41px}.page-control-aranas .lead{font-size:18px}.page-control-aranas .benefit-grid{grid-template-columns:1fr;gap:18px}.page-control-aranas .benefit-grid article+article{border-left:0;border-top:1px solid #d8e2e5;padding-top:18px}.page-control-aranas .hideouts-card, .page-control-aranas .control-plan-card{padding-inline:16px}.page-control-aranas .hideout-list{grid-template-columns:1fr 1fr}.page-control-aranas .step-card{grid-template-columns:32px 42px 1fr;padding-inline:10px}.page-control-aranas .step-card>img{width:38px;height:38px}.page-control-aranas .warning-bar{grid-template-columns:1fr;gap:9px}.page-control-aranas .warning-main{grid-column:auto}.page-control-aranas .warning-tip{white-space:normal}.page-control-aranas .warning-symbol{width:50px;height:50px}.page-control-aranas .warning-main strong{font-size:15px}.page-control-aranas .sector-card{grid-template-columns:60px 1fr;min-height:135px;padding-inline:18px}.page-control-aranas .sector-icon{width:55px;height:55px}
}